注册表单:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>设计注册表单</title> <style type="text/css"> body,div,h2,form,fieldset,input,textarea{ margin:0; padding:0; border:0; outline:none; } html{height:100%;} body{background:#728eaa; font-family:"新宋体"; margin-bottom:20px; padding-bottom:40px; } #container{ width:430px; margin:30px auto; padding:60px 30px; background:#c9d0de; border:1px solid #e1e1e1; border-radius:16px; } h1{ font-size:35px; color:#445668; text-align:center; margin:0 0 35px 0; text-shadow:0px 2px 0px #f2f2f2; } label{ float:left; clear:left; margin:11px 20px 0px 0px; width:95px; text-align:right; font-size:18px; font-family:"宋体"; color:#445668; text-shadow:0px 1px 0px #f2f2f2; } input{ width:210px; height:35px; padding:12px 20px 0px 20px; margin:0px 0px 20px 0px; background-color:#5E768D; border-radius:5px; font-family:"宋体"; font-size:16px; color:a1b2c3; text-shadow:0px -1px 0px #334f71; line-height:1em; } textarea{ width:210px; height:170px; padding:12px 20px 0px 20px; margin:0 0 20px 0; background:#5E768D; font-family:"宋体"; font-size:16px; color:f2f2f2; text-shadow:0px -1px 0px #334f71; } text{ color:#a1b2c3; text-shadow:0px -1px 0px #38506b; } input:focus, textarea:focus{background:#728eaa;} p {margin-left:140px; } input[type=submit]{ width:105px; height:42px; border:1px solid #568f8c; cursor:pointer; color:#FFFFFF; } </style> </head> <body> <div id="container"> <h1>用户注册</h1> <form> <fieldset> <label for="name">用户名:</label> <input type="text" id="name" placeholder="Enter your full name" /> <label for="email">Email:</label> <input type="text" id="email" placeholder="Enter your email address" /> <label for="password">密码:</label> <input type="password" id="password" placeholder="Enter your password" /> <label for="password">密码重复:</label> <input type="password" id="password" placeholder="Enter your password again"/> <p> <input type="submit" value="重新填写" /> <input type="submit" value="注册" /> </p> </fieldset> </form> </div> </body> </html>
样式: