HTML/CSS sign up form - HTML CSS CSS Form

HTML CSS examples for CSS Form:Form

Description

HTML/CSS sign up form

Demo Code

ResultView the demo in separate window

<!doctype html>
<html>
 <head> 
  <title>Lorem ipsu</title> 
  <style>
.container {<!--from www.  j a v  a  2s.  c o  m-->
   width:46%;
   margin:auto;
}

.form-content {
   margin:41px;
}

.form-content input {
   width:100%;
}

label {
   font-weight:bold;
}

input[type=text],[type=email],[type=tel],[type=date],[type=password] {
   font-size:17px;
   border-radius:6px;
   background:Chartreuse;
   border:yellow;
   padding:11px;
}

input[type=submit] {
   background:blue;
   padding:11px;
   border:none;
   border-radius:6px;
   font-size:17px;
   color:pink;
   cursor:pointer;
}

input[type=submit]:hover {
   background:OrangeRed;
   font-weight:bold;
}
</style> 
 </head> 
 <body> 
  <div class="container"> 
   <form name="signup" method="get" action=""> 
    <div class="form-content"> 
     <label>Lorem ipsum d</label> 
     <input type="text" name="firstname"> 
    </div> 
    <div class="form-content"> 
     <label>Lorem ipsum </label> 
     <input type="text" name="lastname"> 
    </div> 
    <div class="form-content"> 
     <label>Lorem ips</label> 
     <input type="email" name="email"> 
    </div> 
    <div class="form-content"> 
     <label>Lorem ipsum </label> 
     <input type="tel" name="telephone"> 
    </div> 
    <div class="form-content"> 
     <label>Lorem ipsum dolo</label> 
     <input type="date" name="dob"> 
    </div> 
    <div class="form-content"> 
     <input type="submit" name="submit" value="Submit"> 
    </div> 
   </form> 
  </div>  
 </body>
</html>

Related Tutorials