CarWebsite.html

 

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Car Website</title>

    <link rel="preconnect" href="https://fonts.googleapis.com">

    <style>

        *{font-family: 'Ubuntu', sans-serif;}

        body{background-image: url("img/erik-mclean-ZRns2R5azu0-unsplash.jpg");

        background-size: cover;

        background-repeat: no-repeat;

       }

       

       #left{width: 10%;display: inline-block;height: 15px;}

       #mid{width: 630px;

    position: fixed;

     top: 5px;

    right: 30%;}

    #left img{height: 120px;width: 150px;}

    #left{color: black;font-weight: bolder;text-align: center;}

       #right{width: 15%;

              position: absolute;

              top: 35px;

            right: 1px;}

        .btn{font-size: 15px;margin-right:5px ;cursor: pointer;

 background-color: darkslategray;color: floralwhite;font-family: 'Ubuntu', sans-serif;}

        .btn:hover{background-color: darkkhaki;color: darkred;cursor: pointer;}

        

        .navBar{background-color:black;border-radius: 122px;}

        .navBar ul{text-decoration: none;}

        .navBar li{display: inline-block;margin:10px 42px;}

        .navBar li a{text-decoration: none;color: rgb(255, 250, 250);font-size: 18px}

        .navBar li a:hover{background-color: #82d9ff;color: darkblue;font-size: 18px;}

        .form{width: 25%;margin-left: 10px;}

        #formPara{text-align: center;font-size: 28px;}

        .formBox {text-align: center;}

        .formBox input{margin: 5px 0px;font-size: 15px;color: forestgreen;

                       border-color: rgb(0, 8, 0);}

        #submit{margin-left: 35% ;margin-bottom: 10px;font-size: 34px;

                font-family: 'Ubuntu', sans-serif;}

    </style>

</head>

<body>

    <header class="header">

        <div id="left" class="container"><img src="img/logo.jpg" alt="">

         Zeeshan-Corporate</div>

        <div id="mid"class="container">

            <ul class="navBar">

                <li><a href="#">Home</a></li>

                <li><a href="#">About Us</a></li>

                <li><a href="#">Help</a></li>

                <li><a href="#">Settings</a></li>

                

            </ul>

        </div>

        <div id="right" class="container">

            <button id="click1"class="btn">Read-More</button>

          <button id="click2"class="btn">Email-Us</button>

        </div>

    </header>

    <div class="form">

       <h3 id="formPara">Submit the form</h3> 

    <form action="noaction.php">

      <div id="name"class="formBox">

          <input type="text"placeholder="Enter your Name">

      </div>

      <div id="mobile"class="formBox">

        <input type="text"placeholder="Enter your Mobile.No">

    </div>

     <div id="Pincode"class="formBox">

        <input type="text"placeholder="Enter your Pin-Code">

    </div>

    <div id="pricerange"class="formBox">

        <input type="text"placeholder="Enter your Desired Model.No">

    </div>

     </form>

     <div id="submit">

     <button>Submit Now</button>

    </div>

</div>

    

</body>

</html>