在 HTML 中,表格是非常重要的元素之一,它能方便地用來展示大量的數據。而在表格中可能出現的單元格跨行現象,是需要特殊的標簽進行處理的。在 CSS 中,我們可以使用 “vertical-align” 屬性來控制單元格中的文本和其他元素對齊方式。
/* 表格中的單元格第一行跨兩行 */跨行單元格 普通單元格 普通單元格 普通單元格 普通單元格
上述代碼中,我們使用了 rowspan 屬性,來使第一個單元格跨越兩行。同時,我們也可以結合 vertical-align 屬性,來改變單元格中文本和其他元素的對齊方式。它有以下幾個取值:
- top:垂直對齊在單元格的頂部。
- middle:垂直對齊在單元格的中間。
- bottom:垂直對齊在單元格的底部。
td {
vertical-align: middle; /* 將單元格中元素垂直對齊于中間 */
}
上述代碼中,我們使用了 universal selector(全局選擇器),來將所有單元格中的元素默認設置在垂直居中的位置。這在表格展示時,有著非常不錯的視覺效果。
下一篇表格斜線一分為二css