常用的登陆表单（DIV+CSS）

关键词：表单,DIV,CSS 时间:2008年05月13日星期二阅读:539

<!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>常用的登陆表单（DIV+CSS）</title>
<style type="text/css">
body{
	background: #FFF;
	font-family: Arial, Helvetica, sans-serif;
	color: #666666;
	padding: 0px;
	margin: 5px;
	text-align: center;	
	font-size: 12px;
}
	form{
	margin: 0px;
	padding: 4px;
	}
	#member{
	width: 170px;
	background: #F1F1F1;	
	text-align: center;
	margin: 20px auto;	
	}
	label{
	width: 45px;
	padding: 3px 0px 1px;	
	color: #666;
text-align: right;
}
input{
	border: 1px solid #CCC;
	margin: 1px;
	padding: 1px;
	font-family: Arial;
	font-size: 12px;
	color: #666;
	}
	.bt{
	width: 22px;
	height: 20px;
	font-size: 10px;
	color: #333;	
	border: solid 1px #CCC;
	background: #FBFBFB;
}
	</style>
</head>
<body><div id="member"><form name="form1" id="form1" method="post" action="#">
	 <div><label for="name">Name:</label>
	 <input name="name" id="name" type="text" size="16" maxlength="10" />
</div><div><label for="pass">Pass:</label>
	 <input id="pass" name="pass" type="password" size="10" maxlength="10" />
	 <input name="Submit" type="submit" class="bt" value="OK" />
</div></form></div>
<p><a href="javascript:history.back()">Back</a></p>
</body>
</html>

提示：可以先修改部分代码后再运行

上一篇：CSS样式命名规则下一篇：HTML中的GroupBox

0条记录访客评论

发表评论