CSS屬性之表格(Table),css屬性工作表格table

來源:互聯網
上載者:User

CSS屬性之表格(Table),css屬性工作表格table

CSS屬性之表格(Table)

HTML為表格定義了3個元素用於對行進行分組,它們是 thead (表頭)、tbody (表格主體)、tfoot (腳註)。

在HTML4中文檔結構中的 tfoot 必須出現在 tbody之前,HTML5去掉了這個限制。

如果在原始碼中沒有寫分組元素時,瀏覽器會自動建立 tbody ,所以選取器 table > tr 總是無效,因為中間有 tbody。

如果表格主體中的每一行都是以 td 元素開頭,那這些 th 就是列名。


colgroup 與 col

<colgroup> 標籤只能在 table 元素中使用。

<col> 標籤只能在 table 或 colgroup 元素中使用。

col 可以在 colgroup 之外使用。

colgroup 中的 col 會覆蓋 colgroup 樣式。



table-layout:auto | fixed

auto: 預設的自動演算法。布局將基於各單元格的內容,換言之,可能你給某個單元格定義寬度為100px,但結果可能並不是100px。表格在每一單元格讀取計算之後才會顯示出來,速度很慢。

fixed: 固定式配置的演算法。在這演算法中,水平布局是僅僅基於表格的寬度,表格邊框的寬度,單元格間距,列的寬度,而和表格內容無關。也就是說,內容可能被裁切。


border-collapse:separate | collapse

separate: 邊框獨立。

collapse: 相鄰邊被合并。

只有當表格邊框獨立(即border-collapse屬性等於separate時),border-spacing和empty-cells才起作用。


border-spacing:<length>{1,2}

用長度值來定義行和單元格的邊框在橫向和縱向上的間距。不允許負值。

如果提供全部兩個length值時,第一個作用於橫向間距,第二個作用於縱向間距。 

如果只提供一個length值時,這個值將作用於橫向和縱向上的間距。 


caption-side:top | bottom

top: 指定caption在表格上邊。

bottom: 指定caption在表格下邊。


empty-cells:hide | show

設定或檢索當表格的單元格無內容時,是否顯示該單元格的邊框。

hide: 指定當表格的單元格無內容時,隱藏該單元格的邊框。 

show: 指定當表格的單元格無內容時,顯示該單元格的邊框。


聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.