HTML制作表格的方法
發(fā)表時(shí)間：2023-09-08 來(lái)源：明輝站整理相關(guān)軟件相關(guān)文章人氣：
[摘要]在html中繪制表格使用table標(biāo)簽，tr表示行，td表示列,下面通過(guò)代碼實(shí)例給大家介紹HTML表格的相關(guān)知識(shí)，感興趣的朋友一起看看吧在html中繪制表格使用table標(biāo)簽?tr表示行?td表示列?th表示表頭，表頭通常用于列名字。下面是一個(gè)列子。<html><head>...
在html中繪制表格使用table標(biāo)簽，tr表示行，td表示列,下面通過(guò)代碼實(shí)例給大家介紹HTML表格的相關(guān)知識(shí)，感興趣的朋友一起看看吧
在html中繪制表格使用table標(biāo)簽
?tr表示行
?td表示列
?th表示表頭，表頭通常用于列名字。
下面是一個(gè)列子。
<html>
<head>
<title>Table in html</title>
</head>
<body>
<p>水平表頭</p>
<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
<th>Gender</th>
</tr>
<tr>
<td>zdd</td>
<td>30</td>
<td>male</td>
</tr>
</table>
<p>垂直表頭</p>
<table border="1">
<tr>
<th>Name</th>
<td>autumn</td>
</tr>
<tr>
<th>Age</th>
<td>30</td>
</tr>
<tr>
<th>Gender</th>
<td>famale</td>
</tr>
</table>
</body>
</html>效果圖
水平表頭
垂直表頭
Name | autumn |
Age | 30 |
Gender | famale |
無(wú)邊框表格
如果在定義表格時(shí)，沒(méi)有指定border屬性，那么表格就沒(méi)有邊框
<table>
<tr><td>zdd</td><td>30</td></tr>
<tr><td>ddz</td><td>27</td></tr>
</table>效果圖
空單元格
如果沒(méi)有為單元格指定內(nèi)容，那么單元格將是空的，且沒(méi)有邊框，如下，這樣很不美觀。
如果解決呢？方法是給空的單元格加上空格，由于html忽略多余的空格，所以我們不能直接加空格，而要加 nbsp表示空格。
<table border="1">
<tr><td>zdd</td><td>30</td></tr>
<tr><td> </td>20</tr>
</table>效果圖
帶標(biāo)題的表格
使用caption屬性，但是好像標(biāo)題中不能有空格，否則顯示的時(shí)候會(huì)換行！
<table border="1">
<caption>我的表格</caption>
<tr><td>zdd</td><td>30</td></tr>
<tr><td> </td><td>20</td></tr>
</table>我的表格
跨行或者跨列的表格
用colspan跨行
<table border="1">
<tr><th>姓名</th><th colspan="2">電話</th></tr>
<tr><td>Bill Gates</td><td>555 77 854</td><td>555 77 855</td></tr>
</table>
姓名 | 電話 |
Bill Gates | 555 77 854 | 555 77 855 |
用rowspan跨列
<table border="1">
<tr><th>姓名</th><td>Bill Gates</td></tr>
<tr><th rowspan="2">電話</th><td>555 77 854</td></tr>
<tr><td>555 77 855</td></tr>
</table>
嵌套的表格
table標(biāo)簽是可以嵌套的，也就是說(shuō)在tr或者td標(biāo)簽中加入table標(biāo)簽即可創(chuàng)建表格中的表格。
總結(jié)：以上就是本篇文的全部?jī)?nèi)容，希望能對(duì)大家的學(xué)習(xí)有所幫助。
相關(guān)推薦：
前端html表格生成excel表格實(shí)例
html表格知識(shí)總結(jié)
重新發(fā)現(xiàn)HTML表格
以上就是HTML制作表格的方法的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！
網(wǎng)站建設(shè)是一個(gè)廣義的術(shù)語(yǔ)，涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。
