HOW TO CREATE FORM USING HTML(INCLUDE CSS)

to create this login page you need html and css code.the required code is below


this is for html

!DOCTYPE html>
<html lang="en">
<head>
    <title>Registration Form </title>
    <link rel="stylesheet" href="style.css">
</head>   
<body>
        <div class="loginbox">
         <img src="j.jpg" class="j">
           <form style="text-align: center;">
               <p><u><i><b>LOGIN</b></i></u> </p>
               <p>ENTER YOUR NAME:</p>
                <P><input type="text" placeholder="username"</P>
                <p>PASSWORD:</p>
                <P><input type="password" placeholder="password" name=""</P>
              <p><input type="submit"></p>
          <table>
              <tr>
                   <td style="font-size: 4px;"> <input type="radio"></td>
                    <td>Remmember me.</tr>
                </tr>
          </table>
                <br>
                <a href="Forget your password?">Forget password?</a>
                <a href="sushant.html">New Registration?</a>
           </form>
     </div>
</body>
</html>


this is for css(cascoding style sheet)
body{margin: 0;
    padding: 0;
background: url(rk.jfif);
background-size:cover;
background-position: center;
font-family: sans-serif

}
   .loginbox {
       width: 320px;
       height: 420px;
       background: #000;
       color: #fff;
       top: 50%;
       left: 50%;
       position: absolute;
       transform: translate(-59%,-50%);
       box-sizing: border-box;
       padding: 50px 10px;
   }


.j{width: 100px;
    height: 100px;
    border-radius: 50%;
    position: absolute;
    top: -50px;
    left:33%;
}
.loginbox input{
    width: 100%; 


}
.loginbox input[type="text"] , input[type="password"]{
    border: none;
    border-bottom: 1px solid #fff;
    background: transparent;
    outline: none;
    height: 30px;
    color: #fff;
    font-size: 16px;
    border-bottom: #fff;
}
.loginbox input[type="submit"]{
    border: none;
    outline: none;
    height: 40px;
    font-size: 20px;
    border-radius: 20px;
    background: rgb(151, 67, 67);
    color: #fff;
}
.loginbox input[type="submit"]:hover{
  cursor: pointer;
  background-color: #ffc107;
  color: #000;
  
}
          

python    math-2    evs    semiconductor

 

Comments

Post a Comment