CSS表格分別設置

CSS是一種用于創建網頁樣式和布局的語言。在網頁中，使用CSS可以創建各種類型的表格，包括表格單元格、表格樣式和表格布局。本文將介紹如何使用CSS來設置表格。

1. 表格單元格

CSS可以用于設置表格單元格的樣式。表格單元格可以使用HTML表格標簽和CSS樣式來創建。例如，以下代碼將創建一個垂直居中的表格，并設置單元格的背景顏色為藍色：

```html

<table>

<tr>

<td>第一列</td>

<td>第二列</td>

<td>第三列</td>

</tr>

<tr>

<td>第一列</td>

<td>第二列</td>

<td>第三列</td>

</tr>

</table>

在上面的代碼中，`<table>`標簽是表格的容器，`<tr>`和`<td>`標簽是單元格元素。`<td>`標簽的樣式可以通過CSS中的`style`屬性來設置，例如：

```css

border: 1px solid #ccc;

padding: 8px;

上面的代碼將設置單元格的邊框為1像素的實線，內邊距為8像素。您可以根據需要自定義樣式。

2. 表格樣式

CSS可以用于設置表格的整體樣式，包括表格邊框、表頭、表尾、行高和列寬等。可以使用`table`和`th`、`td`標簽來設置表格的樣式。例如，以下代碼將創建一個寬度為100像素的表格，并設置表格的邊框和背景顏色為白色：

```html

<table>

<tr>

<th>標題1</th>

<th>標題2</th>

<th>標題3</th>

</tr>

<tr>

<td>第一行第一列</td>

<td>第一行第二列</td>

<td>第一行第三列</td>

</tr>

</table>

在上面的代碼中，`<table>`標簽是表格的容器，`<th>`和`<td>`標簽是單元格元素。`<th>`標簽的樣式可以通過CSS中的`style`屬性來設置，例如：

```css

background-color: #4CAF50;

border: 1px solid #ccc;

padding: 8px;

上面的代碼將設置單元格的背景顏色為白色，邊框和內邊距為1像素。您可以根據需要自定義樣式。

3. 表格布局

CSS還可以用于設置表格的布局，包括表格的對齊方式、表格的滾動方式等。可以使用`tr`和`td`標簽來設置表格的行和單元格的對齊方式。例如，以下代碼將設置表格的第一行和第二列對齊方式是垂直居中：

```html

<table>

<tr>

<td>第一列</td>

<td>第二列</td>

</tr>

<tr>

<td>第一行第二列</td>

<td>第二行第三列</td>

</tr>

</table>

在上面的代碼中，`<tr>`標簽是表格的行元素，`<td>`標簽是單元格元素。`<td>`標簽的對齊方式可以通過CSS中的`對齊方式`屬性來設置，例如：

```css

text-align: center;

上面的代碼將設置單元格的對齊方式為垂直居中。您可以根據需要自定義對齊方式。

以上就是使用CSS來設置表格的分別介紹。通過使用CSS，可以創建各種類型的表格，包括表格單元格、表格樣式和表格布局，使網頁更加美觀。