Exercise NO>10

HEADER MENU WITH CONTACT FORM (HTML/ CSS)

Project NO.12

{   Sahelg.com   }    

 

Note); If you have any type of question, comment us or contact>>> imtaizbaloch38@gmail.com)

 Start with <HTML >tags


<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<style>

body{

margin:0;

padding:0;

background-image:url(123/453.jpg);

background-size:cover;

background-position

height:100vh;

                }

                .menu   {

                width:950px;

                margin:0 auto;

                                }

                                .menu ul{

                                list-style:;

                                margin-top:2%;

                                }

                                .menu ul li{

                                                background:green;

                                                width:170px;

                                                margin:0px;

                                                border: 1px solid #fff;

                                                height:50px;

                                                height-line:50px;

                                                text-align:center;

                                                float:left;

                                                color:#fff;

                                                font-size:20px;

                                                position:relative;

                                                font-family:big john;

                                                }

                                                .menu ul li:hover{

                                                background:crimson;

                                                }

                                                .menu ul ul {

                                                display:none;

                                                margin-top:30px;

                                                                }

                                                .menu ul li:hover > ul{

                                                                display:block;

                                                                }

                                                                .menu ul ul ul{

                                                                margin-left:130px;

                                                                top:-5px;

                                                                position:absolute;

                                                                                }

</style>

</head>

<body>

<div class="menu">

<ul>

<li>Home</li>

<li>About</li>

<li>Services

<ul>

<li>Marketing</li>

<li>design

<ul>

<li>Web</li>

<li>graphic</li>

<li>interior</li>

</ul>

</li>

<li>Brading</li>

</ul>

</li>

<li>Portfolio</li>

<li>Contact</li>

</ul>

</div>

<div>

<fieldset>

<input type="Name" placeholder="Nmae" /><br><br>

<input type="Password" placeholder="Password" /><br><br>

<input type="Email" placeholder="Email" /><br><br>

<input type="Contact" placeholder="Phone NO" /> <br><br>

<input type="Reset" value="Reset">

<input type="submit" value="save">

 

</fieldset>

</div>

 

 

</body>

  </html>

Post a Comment

1 Comments

Thanks for your feedback we will reply Fast.