在html中一個table表單主要由tr、td、th元素組成,比較復雜一點的表單還會包含caption、 col、 colgroup、 thead、tfoot、 tbody等元素.
一、table內標簽含義:
<tr>:表格的行標簽,有多少對<tr></tr>就有多少行.
<td>:普通單元格標簽,位於<tr>標簽內部.
<th>:表頭單元格標簽,位於<tr>標簽內部.
<caption>:用於定義表格的標題.
<col>:定義表格中一個或多個列定義屬性值
<colgroup>:表格列進行組合,方便對其格式化處理
<thead>:表格的頭部,主要用於放標題這些
<tbody>:表格的身體,主要用於數據內容
<tfoot>:表格的腳注之類
二、table內標簽說明
1、<td>和<th>的區別:
它們都是表格單元格的標簽,不同之處是<th>的內容顯示為粗體效果
在html4.01中,<th>是不贊成使用這些屬性的:"bgcolor"、"height"、"width"、"nowrap"
2、<col>和<colgroup>的兼容性:
在Firefox、Chrome、Safari等瀏覽器中, <col>支持的屬性為: "width"、"background"、"background-color"
<colgroup>支持的屬性為:"span"、"width"、"background"、"background-color"
3、<thead>、<tbody>、<tfoot>的使用
table中使用<tbody>可以起到優化顯示的作用。比如當你表格很長,使用tbody分段能讓部分部分的顯示出來,減少用戶的等待.
使用了<thead>、<tbody>、<tfoot>它們,表格的顯示一定為從頭到腳,不論你寫的代碼順序是怎么樣的.
pixabayhttps://www.wode007.com/sites/73237.html wallhavenhttps://www.wode007.com/sites/73236.html
三、table表格常用屬性:
1、align:表格的水平對齊方式 。值分別有:align="left" 表格左對齊,center居中對齊,right右對齊
2、width:表格的寬度。
3、height:表格的高度。
4、background:表格的背景顏色或背景圖片。
5、border:表格邊框的寬度,同時border屬性會應用到每個單元格。默認為1px,當border的值修改時(>1),只會影響table表格的外邊框。
6、cellspacing:指定單元格之間的間距。為0的時候表格間是沒有間距的。
7、cellpadding:單元格邊界與單元格內容之間的間距,默認為0。
8、frame:指定表格外側邊框的那個部分是否可見。屬性值如下:
void:外側邊框 不顯示
box:所有的外側邊框都顯示
border:所有的外側邊框都顯示,等同於box,沒有任何區別
above:顯示外側邊框的上側
below顯示外側邊框的下側
lhs:顯示外側邊框的下部左側
rhs:顯示外側邊框的下部右側
hsides:顯示外側邊框的上下側
vsides:顯示外側邊框的左右側
9、rules:指定表格內側邊框的那個部分是否可見。屬性值如下:
none:不顯示內線條
all:顯示全部內線條
rows:顯示行之間的線條
cols:顯示列之間的線條
groups:顯示行組和列組之間的線條