這是效果圖

1560342663(1).jpg

以下是編寫方法：

<table  rules='all'>
<caption>
征婚簡歷
</caption>
<tbody>
<tr>
<td>姓名</td>
<td  width='100px'></td>
<td>性別</td>
<td  width='100px'></td>
<td>籍貫</td>
<td  width='100px'></td>
<td>學(xué)歷</td>
<td  width='100'></td>
<td  rowspan="4"  width='100'>照片</td>
</tr>
<tr>
<td>出生日期</td>
<td></td>
<td>年齡</td>
<td></td>
<td>身高</td>
<td></td>
<td>體重</td>
<td  width='100'></td>
</tr>
<tr>
<td>理想類型</td>
<td  colspan="3"></td>
<td>實際類型</td>
<td  colspan="3"></td>
</tr>
<tr>
<td>微信/QQ</td>
<td  colspan="3"></td>
<td>電話號碼</td>
<td  colspan="3"></td>
</tr>
<tr>
<td>身份證號</td>
<td  colspan="8"></td>
</tr>
<tr>
<td>家庭條件</td>
<td  colspan="2"></td>
<td>薪資福利</td>
<td></td>
<td>居住環(huán)境</td>
<td  colspan="3"></td>
</tr>
<tr>
<td>感情經(jīng)歷</td>
<td  colspan="2"></td>
<td>起止時間</td>
<td  colspan="2"></td>
<td>分手原因</td>
<td  colspan="2"></td>
</tr>
</tbody>
</table>

Html寫好內(nèi)容后在css內(nèi)編寫樣式即可。

table {
margin: 0  auto;
border: 1px  solid  rgb(57, 7, 236);
width: 1000px;
font-size: 25px;
text-align: center;
caption {
font-size: 50px;
}
}

表格標簽<caption>，英語單詞是標題的意思。是用來做表格的標題。
tr :是表格的行。
td ：是表格的列。
在table標簽中可以使用width（寬）和height（高）屬性設(shè)置表格寬度和度。
可以按像素或百分比來指定表格寬度或高度。

若需要將多列合并成一列 則需要用到colspan屬性?？梢苑Q呼為 跨列。

若需要將多行合并成一行，則需要用到rowspan屬性?？梢苑Q呼為 跨行。

若需將表格的邊框去掉，將<table rules='all'>里面的all去掉即可。

編寫表格的方法就是這樣簡單，大家感興趣可實戰(zhàn)一下