CSS(Cascading Style Sheets)是一種用于網頁設計的樣式表語言,用于描述 HTML 或 XML(包括 SVG、MathML 等)文檔結構的表示方式。CSS 可以很好地幫助網頁設計者完成網頁的美化工作。下面將講述如何使用 CSS 建立表格。
/* CSS 建立表格的代碼示例 */ table { border-collapse: collapse; width: 100%; /* 寬度為 100%,充滿容器 */ } th, td { border: 1px solid black; /* 給表格邊框加上 1px 的黑色線條 */ padding: 8px; /* 表格單元格內文字與邊框的距離為 8px */ text-align: left; /* 文字左對齊 */ } th { background-color: #f2f2f2; /* 表頭背景顏色為淺灰色 */ font-weight: bold; /* 表頭文字加粗 */ } tr:nth-child(even) { background-color: #f2f2f2; /* 表格每隔一行背景顏色變淺 */ }
上述代碼中,首先為表格設置了邊框合并,并設置寬度為 100%,使表格自動適應容器大小。然后使用 th 和 td 標簽定義表頭和表格單元格,并給它們添加了邊框和內邊距。
表頭還設置了背景顏色和加粗樣式,在視覺上與表格單元格區分開來。最后通過 nth-child 選擇器將表格中每隔一行的背景顏色變淺,增強數據的可讀性。
使用 CSS 建立表格可以使表格變得美觀易讀,對于網頁設計中的表格布局也有很大的幫助。以上是 CSS 建立表格的簡要介紹,希望能對大家有所幫助。