Tip: you can modify some code before running
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.111cn.net/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>Label beautification</title> <style type="text/css"># Commentform {font-size: 12px;} # commentform label {width: 55px; height: 24px; display: block; float: left; background: url (yun_qi_img/label.png) no-repeat left top; line-height: 22px; color: #999; padding-left: 18px;} * html # commentform label {float: none; display: inline; padding: 5px 15px 10px 18px; margin-right: 10px; vertical-align: middle;} # commentform input {height: 20px; width: 220px; border: 1px solid # EEE; padding: 4px 4px 0 4px;} # commentform p. input: hover label, # commentform p. input: active label, # commentform p. input: focus label {background: url (yun_qi_img/label.png) no-repeat left-40px; color: #000 ;}# commentform input # submit {width: 82px; height: 24px; background: url (yun_qi_img/submit.png) no-repeat left top; margin-left: 73px; color: #999; border: 0 none; line-height: 100%; display: block; padding: 0; cursor: pointer;} # commentform input # submit: hover, # commentform input # submit: active, # commentform input # submit: focus {background: url (yun_qi_img/submit.png) no-repeat left bottom; color: #000 ;}</style> </head> <body> <form id="commentform" method="post" action=""> <p class="input"><label for="author">Last name</label><input type="text" aria-required="true" tabindex="1" size="12" value="" id="author" name="author"></p> <p class="input"> <label for="email">Mail</label><input type="text" aria-required="true" tabindex="2" size="12" value="" id="email" name="email"></p> <p><input type="submit" value="提交评论" tabindex="5" id="submit" name="submit"></p> </form> </body> </html>
Tip: you can modify some code before running