Membuat Form Registrasi Menggunakan HTML 5 dan CSS3

Seperti kita ketahui bersama HTML 5 memberikan kita kemudahan tampilan baik, dan saat ini penulis coba memberikan salah satunya, seperti yang coba penulis buat adalah membuat form registrasi dengan html 5 dan css3 yang biasanya form yang yang satu ini biasa menggunakan javascripts tapi untuk kali ini penulis coba membuat variasi berbeda. 

Berikut ini tampilan dari form tersebut :

 

HTML

<form action="" method="post">
   <div id='name' class='outerDiv'>
	<label for="name">Full name:</label>
	<input type="text" name="name" required  />
	<div class='message' id='nameDiv'> Enter your 
first and last name. </div> </div> <div id='username' class='outerDiv'> <label for="number">Username:</label> <input type="text" name="username" required /> <div class='message' id='usernameDiv'> Pick a
unique name on Twitter. </div> </div> <div id='password' class='outerDiv'> <label for="password">Password:</label> <input type="password" name="password" required /> <div class='message' id='websiteDiv'>6 characters
or more (be tricky!).</div> </div> <div id='email' class='outerDiv'> <label for="email">Email:</label> <input type="email" name="email" required /> <div class='message' id='emailDiv'> We'll send
you a confirmation.</div> </div> <div id='submit' class='outerDiv'> <input type="submit" value="Create my account" /> </div> </form>

CSS

#twitter input:not(:focus){
	opacity:0.6;
}

#twitter  input:required{
}

#twitter  input:valid {
	opacity:0.8;
}		

#twitter input:focus:invalid{
	border:1px solid red;
	background-color:#FFEFF0;
}

Berikut ini untuk mengdownload versi lengkap program tersebut disini dan penulis ingin mengucapkan ke nikesh.me atas informasi penting ini

Kunjungi www.prowebpro.com untuk menambah wawasan anda.

 

Web Design Packages

Paket BasicPaket BusinessPaket Corporate

Livechat

  • Eddy Marketing

  • Iwan Marketing

  • Agus Support

Address

PT. Proweb Indonesia
Perkantoran Duta Merlin No F4
Jl. Gadjah Mada 3-5
Jakarta Pusat
GPS: S 6o 09' 58.1", E 106o 49' 3.3"

 

Marketing : 021-2636-3170
    021-4631-0337 (Edi)
    0812-3356-3561 (Edi)
    087-888-190-566 (Iwan)
     
WhatsApp : 0813-1977-8908 (Iwan)
    0812-806-2772
     
Support : 021 - 3377 0050
    08788-9089-588 (Agus)
     
Finance : 021-2636-3170
    0816-180-8005 (Yudi)
     
Web : www.proweb.co.id