CSS表格

目錄

• 1 border-collapse
• 2 border-spacing
• 3 caption-side
• 4 empty-cells

border-collapse

語法：border-collapse : separate | collapse
取值：
separate  :　 默認(rèn)值。邊框獨(dú)立（標(biāo)準(zhǔn)HTML）
collapse  :　 相鄰邊被合并

說明：
設(shè)置或檢索表格的行和單元格的邊是合并在一起還是按照標(biāo)準(zhǔn)的HTML樣式分開。
此屬性對于 currentStyle 對象而言是只讀的。對于其他對象而言是可讀寫的。
對應(yīng)的腳本特性為 borderCollapse 。
示例：
table { border-collapse: separate; }

border-spacing

語法：border-spacing : length
取值：
length  :　 由浮點(diǎn)數(shù)字和單位標(biāo)識(shí)符組成的長度值。不可為負(fù)值。

說明：
設(shè)置或檢索當(dāng)表格邊框獨(dú)立(例如當(dāng) border-collapse 屬性等于 separate 時(shí))，行和單元格的邊在橫向和縱向上的間距。
當(dāng)只指定一個(gè) length 值時(shí)，這個(gè)值將作用于橫向和縱向上的間距。
當(dāng)指定了兩個(gè) length 值時(shí)，第一個(gè)作用于橫向間距，第二個(gè)作用于縱向間距。
對應(yīng)的腳本特性為borderSpacing。
示例：
table { border-collapse: separate; border-spacing: 10px; }

caption-side

語法：caption-side : top | right | bottom | left
取值：
top  :　 默認(rèn)值。 caption 在表格的上邊
right  :　 caption 在表格的右邊
bottom  :　 caption 在表格的下邊
left  :　 caption 在表格的左邊

說明：
設(shè)置或檢索表格( table )的 caption 對象是在表格的那一邊。它是和 caption 對象一起使用的屬性。
對應(yīng)的腳本特性為 captionSide 。
示例：
table caption { caption-side: top; width: auto; text-align: left; }

empty-cells

語法：empty-cells : show | hide
取值：
show  :　 默認(rèn)值。顯示邊框
hide  :　 隱藏邊框

說明：
設(shè)置或檢索當(dāng)表格的單元格無內(nèi)容時(shí)，是否顯示該單元格的邊框。
只有當(dāng)表格行和列的邊框獨(dú)立（例如當(dāng) border-collapse 屬性等于 separate ）時(shí)此屬性才起作用。
對應(yīng)的腳本特性為 emptyCells 。
示例：
table { caption-side: top; width: auto; border-collapse: separate; empty-cells: hide; }