<!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=utf-8"?/>
????<title>無標題文檔</title>
????
<style?type="text/css">
????.myForm{
????????width:220px;
????????height:260px;
????????background:#CCDDFF;
????}
????#td1{
????????width:180px;
????????height:30px;
????????margin:10px?10PX?5PX?10PX;
????????border:1px?solid?#AAAAAA;
????????padding-left:10px;
????}
????span{font-size:10px;}
????a{font-size:10px;color:blue;}
????#checkbox1{margin-left:10px;}
????#button1{
????????width:190px;
????????height:40px;
????????margin:10px?10PX?5PX?10PX;
????????background:url(http://img1.sycdn.imooc.com//539a972b00013e9102280177.jpg);
????????background-position:0?0;
????}
????#button2{
????width:190px;
????height:40px;
????margin:10px?10PX?5PX?10PX;
????background:url(http://img1.sycdn.imooc.com//539a972b00013e9102280177.jpg);
????background-position:0?-38px;
????}
</style>
</head>
<body>
<form?action="save.php"?method="post">
<div?class="myForm">
<table>????
????<tr>
????????<td><input?type="text"?name="user-name"?placeholder="郵箱/手機號/用戶名"?id="td1"></td>
????</tr>
????<tr>
????????<td><input?type="text"?name="passwards"?placeholder="請輸入密碼"?id="td1"></td>
????</tr>
????<tr>
????????<td><input?type="checkbox"?id="checkbox1"><span>下次自動登錄</span><a>    忘記密碼？</a></td>
????</tr>
????<tr>
????????<td><input?type="button"?id="button1"></td>
????</tr>
????<tr>
????????<td><input?type="button"?id="button2"></td>
????</tr>
</table>
</body>
</html>
2016-12-20
首先，不應該使用<table>標簽，因為<table>標簽現在已經過時了（就好像現在你稱呼別人為‘同志’的情況是一樣的），然后div應該不設置高度，讓里面的元素自動撐開就行了，其次代碼還可以簡化，比如你的登錄和注冊按鈕都引用同一張背景圖片，可以簡寫在一行代碼中。最后，‘忘記密碼？’不應該加空格把它稱到右邊，應該使它浮動到右邊（float：right）
2015-11-11
.........
2015-11-04
<!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=utf-8"?/> ????<title>無標題文檔</title> ????? <style?type="text/css"> ????.myForm{ ????????width:220px; ????????height:260px; ????????background:#CCDDFF; ????} ????#td1{ ????????width:180px; ????????height:30px; ????????margin:10px?10PX?5PX?10PX; ????????border:1px?solid?#AAAAAA; ????????padding-left:10px; ????} ????span{ ????????font-size:10px; ????} ????a{ ????????font-size:10px;color:blue; ????} ????#checkbox1{ ????????margin-left:10px; ????} ????#button1{ ????????width:190px; ????????height:40px; ????????margin:10px?10PX?5PX?10PX; ????????background:url(http://img1.sycdn.imooc.com//539a972b00013e9102280177.jpg); ????????background-position:0?0; ????} ????#button2{ ????????width:190px; ????????height:40px; ????????margin:10px?10PX?5PX?10PX; ????????background:url(http://img1.sycdn.imooc.com//539a972b00013e9102280177.jpg); ????????background-position:0?-38px; ????} </style> ? </head> <body> ????<form?action="save.php"?method="post"> ????????<div?class="myForm"> ????????????<table>???? ????????????????<tr> ????????????????????<td> ????????????????????????<input?type="text"?name="user-name"?placeholder="郵箱/手機號/用戶名"?id="td1"> ????????????????????</td> ????????????????</tr> ????????????????<tr> ????????????????????<td> ????????????????????????<input?type="text"?name="passwards"?placeholder="請輸入密碼"?id="td1"> ????????????????????</td> ????????????????</tr> ????????????????<tr> ????????????????????<td> ????????????????????????<input?type="checkbox"?id="checkbox1"> ????????????????????????????<span>下次自動登錄</span> ????????????????????????????<a>    忘記密碼？</a> ????????????????????</td> ????????????????</tr> ????????????????<tr> ????????????????????<td> ????????????????????????<input?type="button"?id="button1"> ????????????????????</td> ????????????????</tr> ????????????????<tr> ????????????????????<td> ????????????????????????<input?type="button"?id="button2"> ????????????????????</td> ????????????????</tr> ????????????</table> ????????</div> //標簽要成對出現 ????</form>?//標簽要成對出現 </body> </html>