<!DOCTYPE html> <html> <head> <title>CSS Focused Form</title> </head> <body> <style type="text/css"> .focus_input{ width:94%; padding:10px 15px; border:2px solid #0099da; margin:5px auto 15px; } .focus_input[type=text]:focus { background-color:#85C2C2; } .focus_input[type=password]:focus { background-color:#FFC68D; } </style> <form> <label>User Name</label> <input type="text" name="name" class="focus_input" placeholder="User Name"> <label>Password</label> <input type="password" name="password" class="focus_input" placeholder="password"> </form> </body> </html>
Output :
Topic :
Focused Forms
