HTML制作WORD表格

效果圖

table屬性

align：讓內容居中，取值為left、right、center
border：設置表格的邊框
cellspacing：單元格與單元格之間的距離
bgcolor：表格的背景色
colspan：跨列數
rowspan：跨行數

HTML代碼

<table class="table" style="width:100%;height:100%;border:1px solid;align:center;font-size:12px;" border cellspacing="0" cellpadding="0">
              <caption style="font-size:24px;font-weight:bold;">個人信息登記表</caption>
              <tr align="center">
                <td rowspan="2"><div class="div1">個人信息</div></td>
                <td>名稱：</td>
                <td colspan="3"><input class="myInput"/></td>
                <td>性別：</td>
                <td><input class="myInput"/></td>
                <td>年齡：</td>
                <td><input class="myInput"/></td>
              </tr>
              <tr align="center">
                <td>地址：</td>
                <td colspan="3"><input class="myInput1"/>省<input class="myInput1"/>市<input class="myInput1"/>縣</td>
                <td>編號：</td>
                <td><input class="myInput"/></td>
                <td>郵編：</td>
                <td><input class="myInput"/></td>
              </tr>
</table>

輸入框代碼樣式

• 輸入框占據全部
  

.myInput{
	width: 100%;
	height: 100%;
	border: none;
	float: left;
	zoom:1;
	outline: medium;
}

• 輸入框分開插入
  

.myInput1{
	width: 50px;
	border: none;
	zoom:1;
	outline: medium;
}