ZuoTi.Pro
Question

web programming (html & css) Parking lot design using html & css.

web programming (html & css)

Parking lot design using html & css.

engineering   Computer-Science   
0 0
Add a comment Improve this question Transcribed image text
Next > < Previous
Sort answers by oldest

Homework Answers

Answer #1

hello,

checkout below code for parking lot design using pure css and html

<!DOCTYPE html>
<html>
<head>
   <title>Parking Lot</title>
</head>
<body>
<style>
   body
   {
       background: #4F4F4F;
       margin: 0 auto;
       padding: 0;
   }
   .container
   {
       max-width: 700px;
       width: 100%;
       margin: 0 auto;
       display: -webkit-box;
       display: -ms-flexbox;
       display: flex;
       -ms-flex-wrap: wrap;
       flex-wrap: wrap;
       padding-top: 75px;
   }
   .container .col-6
   {
       -webkit-box-flex: 0;
       -ms-flex: 0 0 40%;
       flex: 0 0 40%;
       max-width: 40%;
       position: relative;
       margin-bottom: 50px;
       padding: 35px;
   }
   .container .col-6 .col
   {
       border-left: 2px solid #fff;
       padding: 15px;
       position: relative;
       min-height: 45px;
       height: 100%;
       max-height: 45px;
       width: 100%;
       text-align: center;
   }
   .container .col-6 .grids
   {
       display: flex;
       flex-direction: row;
       flex-wrap: nowrap;
       justify-content: center;
       align-items: stretch;
       align-content: stretch;

   }
   .container .col-6 .grids .col:after
   {
       content: "";
       height: 2px;
       width: 100%;
       background: #fff;
       position: absolute;
       display: block;
       bottom: 0;
       left: 0;
       right: 0;
   }
   .container .col-6 .grids:last-child .col:after
   {
       content: "";
       display: none;
   }
   .container .col-6 .col:last-child
   {
       border-right: 2px solid #fff;
   }
   p
   {
       color: #fff;
   }
   @media only screen and (max-width: 767px)
   {
       .container .col-6 {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 100%;
            flex: 0 0 100%;
            max-width: 100%;
            padding: 0px;
       }
   }

</style>
<div class="container">

<div class="col-6">
<div class="grids" style="">
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
</div>
<div class="grids" style="">
   <div class="col">
  
   </div>
   <div class="col">
       <p>V</p>
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
</div>
</div>

<div class="col-6">
<div class="grids" style="">
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
</div>
<div class="grids" style="">
   <div class="col">
       <p>V</p>  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
</div>
</div>

<div class="col-6">
<div class="grids" style="">
   <div class="col">
       <p>V</p>  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
       <p>V</p>  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
</div>
<div class="grids" style="">
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
       <p>V</p>  
   </div>
   <div class="col">
  
   </div>
</div>
</div>

<div class="col-6">
<div class="grids" style="">
   <div class="col">
       <p>V</p>  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
</div>
<div class="grids" style="">
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
   <div class="col">
  
   </div>
</div>
</div>
</div>

</body>
</html>

0 0
Add a comment
Know the answer?
Add Answer to:
web programming (html & css) Parking lot design using html & css.
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Log In

Sign Up

Not the answer you're looking for? Ask your own homework help question. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions

  • Ayout References Mailings ReviewView nment 1 Write the required HTML/CSS codes to design the web ...

    write a Html/CSS codes to design web page below ayout References Mailings ReviewView nment 1 Write the required HTML/CSS codes to design the web page below: YAHOO English (US) ayout References Mailings ReviewView nment 1 Write the required HTML/CSS codes to design the web page below: YAHOO English (US)

  • Styles Assignment 1 Write the required HTML/CSS codes to design the web page below: YAHOO Norma...

    Styles Assignment 1 Write the required HTML/CSS codes to design the web page below: YAHOO Normal 1 No Sp Font Paragraph Q1: Build the following tables using HTML codes: 1. Send My Table Example celipacing contro boedesWeb pag wtrluter apper isside de TABLE tag nnbutes appear inside the TD g 2. Time Table Mon Tue Wed Thu Fri Science Maths Science Maths Arts Social History English Social Sports Sclence Maths Science Maths SocialHistory English Social Hours Lunch Project Styles 3....

  • Styles Assignment 1 Write the required HTML/CSS codes to design the web page below: YAHOO Normal...

    Styles Assignment 1 Write the required HTML/CSS codes to design the web page below: YAHOO Normal 1 No Sp Font Paragraph Q1: Build the following tables using HTML codes: 1. Send My Table Example celipacing contro boedesWeb pag wtrluter apper isside de TABLE tag nnbutes appear inside the TD g 2. Time Table Mon Tue Wed Thu Fri Science Maths Science Maths Arts Social History English Social Sports Sclence Maths Science Maths SocialHistory English Social Hours Lunch Project Styles 3....

  • 1 Mark Learning Outcome(s): Identify most HTML tags and CSS properties and use a text editor...

    1 Mark Learning Outcome(s): Identify most HTML tags and CSS properties and use a text editor to construct the basic HTML and CSS structure for a webpage. Question One Write Step by Step Instruction for creating a new Website. What are the Technologies & Tools needed for creating your Web Site? web design

  • I want to know about a few web applications with HTML and CSS for year 1...

    I want to know about a few web applications with HTML and CSS for year 1 students which my team could develop a prototype in around 4 weeks

  • How to make this same webpage using HTML and css properties like display property, float,clear and...

    How to make this same webpage using HTML and css properties like display property, float,clear and media queries Picture Tools lab04 (1).docx - Saved to this PC raw Design Layout References Mailings Review View Help Format Tell me spigotdesign VISUAL DESIGN&WEB DEVELOPMENT FROM PARK CITY UTAH ESIGNDEVELLP SUPPORT HOST THE ADMIN BAR AND SOLUTE PASTINNG 200e WEBSTE TESTING

  • Look at the following illustrated output for an HTML and a css given below <!DOCTYPE html>...

    Look at the following illustrated output for an HTML and a css given below <!DOCTYPE html> <head> <title>TABLE with STYLE SHEET</title> <meta charset="utf-8" /> <meta name="description" content="Godaddy Webpage original" /> <link rel = "stylesheet" href="GoDaddy_assignment_1.css"> <body> <img src= "GoDaddy.png"/> <p>Welcome to:<strong>webhamster.com</strong></br> This web page is parked<strong>Free</strong>courtesy of <a class="aclass1" href ="https://www.godaddy.com">GoDaddy.com</a></p> <h1>Want to buy<span class ="span2">webmaster.com ?</span></h1> <div class ="div1"> <a class ="aclass2" href="https://www.godaddy.com">Learn How</a> </div> </hr> <button>Search Ads</button> </body> </html> “ QUESTION continued Given the corresponding css file .aclass1{color:purple;}...

  • Create HTML CSS web page that looks like the visual prototype

    Create HTML CSS web page that looks like the visual prototype Home Feedback contact event jdhsajkflkafffjlkdsjglksjgkjlk nfjkdshgakjh:kgjdflkgifgd:lkjk nfdjskahgkjklgj:kljgkjlklf;ligjg ifsdjljkhosgl:kkl; grjkljekllIjk1 grnjkkkkkkkknn grnjklnrgjkljikj dkjalk kljgklfj vdsljkg Ifiglks jgfjkalh akiklig kdfjg.lk dklghk kjdfhakitjgkif dfigkldjlkfdjkl gfkj gjkldsf Home Feedback contact event jdhsajkflkafffjlkdsjglksjgkjlk nfjkdshgakjh:kgjdflkgifgd:lkjk nfdjskahgkjklgj:kljgkjlklf;ligjg ifsdjljkhosgl:kkl; grjkljekllIjk1 grnjkkkkkkkknn grnjklnrgjkljikj dkjalk kljgklfj vdsljkg Ifiglks jgfjkalh akiklig kdfjg.lk dklghk kjdfhakitjgkif dfigkldjlkfdjkl gfkj gjkldsf

  • CSS or Source Code and html source code to design Awoko Newspaper website that consists of...

    CSS or Source Code and html source code to design Awoko Newspaper website that consists of title of each BUSINESS & FINANCE, EDITORIAL, AWOKO TOK TOK ENTERTAINMENT, FEATURES , NEWS, SPORTS.

  • easy html and css questions. no copy and paste please, use ur own word for a...

    easy html and css questions. no copy and paste please, use ur own word for a thumbs up 1. Explain the differences between CSS margins and padding. 2. Why do all HTML 5 web browsers behave the same even on faulty input? 3. What is the difference between an <ellipse> and a <circle> element in SVG? What is the difference between uppercase and lowercase commands in SVG path data? 4. Why is it important to provide text descriptions of the...

ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT