怎么用 CSS 設置表格樣式

隨著網絡技術的發展，越來越多的人開始使用網頁表格來記錄和展示數據。表格樣式的設置對于網頁表格的外觀和排版非常重要，能夠提高網頁的整體美觀度。在 CSS 中，我們可以使用表格樣式來設置表格的邊框、表頭、表尾、單元格的樣式等。下面，我們將詳細介紹如何使用 CSS 設置表格樣式。

1. 邊框樣式

CSS 可以使用邊框樣式來設置表格的邊框樣式。邊框樣式可以設置邊框的顏色、寬度、寬度、半徑等。

例如，如果我們想要設置表格邊框的顏色為紅色，寬度為 100 像素，半徑為 5 像素，可以使用以下代碼：

```css

table {

border-collapse: collapse;

border: 1px solid red;

width: 100%;

2. 表頭樣式

CSS 可以使用表頭樣式來設置表格的表頭樣式。表頭樣式可以設置表頭的文字、字體、字號、顏色等。

例如，如果我們想要設置表格表頭的文字為“姓名”、“年齡”、“性別”等，可以使用以下代碼：

```css

font-size: 14px;

font-weight: bold;

color: #fff;

text-align: center;

3. 表尾樣式

CSS 可以使用表尾樣式來設置表格的表尾樣式。表尾樣式可以設置表尾的文字、字體、字號、顏色等。

例如，如果我們想要設置表格表尾的文字為“聯系方式”，可以使用以下代碼：

```css

text-align: right;

font-size: 14px;

font-weight: bold;

color: #fff;

text-decoration: none;

4. 單元格樣式

CSS 可以使用單元格樣式來設置表格單元格的樣式。單元格樣式可以設置單元格的字體、字號、顏色、對齊方式等。

例如，如果我們想要設置表格第一行單元格的字體為藍色，字號為 12 像素，顏色為藍色，對齊方式是居中，可以使用以下代碼：

```css

font-family: Arial, sans-serif;

font-size: 12px;

color: #fff;

text-align: center;

border: 1px solid blue;

以上就是如何使用 CSS 設置表格樣式的詳細介紹。通過使用 CSS 表格樣式，我們可以輕松地讓表格外觀更加美觀，排版更加合理。