?1 <!doctype html> ?2 <html> ?3 ????<head> ?4 ????<title>EasyMall注册界面</title> ?5 ????<meta http-equiv="content-type" content="text/html" charset="utf-8"> ?6 ????<link rel="stylesheet" href="D:/MyEclipse 10/day02/regit/css/regit.css"> ?????7 ????</head> ?8 ????<body> ?9 ????<h1>欢迎注册EasyMall</h1> 10 ????<form action="#" method="post"> 11 ????<table> 12 ????<tr> 13 ????????<td class="td_txt">用户名：</td> 14 ????????<td><input type="text" name="usrename"></td> 15 ????</tr> 16 ????<tr> 17 ????????<td class="td_txt">密码：</td> 18 ????????<td><input type="password" name="password"></td> 19 ????</tr> 20 ????<tr> 21 ????????<td class="td_txt">确认密码：</td> 22 ????????<td><input type="password" name="password1"></td> 23 ????</tr> 24 ????<tr> 25 ????????<td class="td_txt">昵称：</td> 26 ????????<td><input type="text" name="nickname"></td> 27 ????</tr> 28 ????<tr> 29 ????????<td class="td_txt">邮箱：</td> 30 ????????<td><input type="text" name="email"></td> 31 ????</tr> 32 ????<tr> 33 ????????<td class="td_txt">验证码：</td> 34 ????????<td><input class="td1" type="text" name="yzm"> 35 ????????<img alt="图片加载失败" src="D:\MyEclipse 10\day02\regit\img\yzm.jpg"></td> 36 ????</tr> 37 ????<tr> 38 ????????<td colspan="2" class="td"><input type="submit" value="注册用户"></td> 39 ????</tr> 40 ????</table> 41 ????</form> 42 ????</body> 43 </html> 44 ?45 ?46 body{ 47 ????background-image: url("D:/MyEclipse 10/day02/regit/img/zc.jpg"); 48 ????background-repeat: no-repeat; 49 ????font-family: "微软雅黑"; 50 ????background-position: top; 51 } 52 h1{ 53 ????text-align:center; 54 ????margin-top: 190px; 55 ????margin-bottom: 30px; 56 ????color:#990000; 57 } 58 table{ 59 ????/*text-align:center;*/ 60 ????margin:0px auto; 61 } 62 table tr td.td_txt{ 63 ????text-align: right; 64 ????font-size: 18px; 65 } 66 .td1{ 67 ????width:80px; 68 ????vertical-align: middle; 69 } 70 .td1+img{ 71 ????vertical-align:middle; 72 } 73 table tr td.td{ 74 ????text-align: center; 75 } 76 input{ 77 ????width:150px; 78 ????height:22px; 79 ????border-color: #ccc; 80 } 81 ?82 input[type="submit"]{ 83 ????background-color:red; 84 ????border:none; 85 ????width:127px; 86 ????height:44px; 87 ????font-size: 20px; 88 ????color:white; 89 ????font-weight: bolder; 90 ?????91 } 92 input[type="submit"]:hover{ 93 ????background-color:blue; 94 } 95 input[type="submit"]:active{ 96 ????background-color: green; 97 } 98 input[type="submit"]:visited{ 99 ????background-color: pink;100 }css给html添加效果
原文地址：https://www.cnblogs.com/mrdragon1994/p/9588920.html