本文目錄導(dǎo)讀：

1. 設(shè)置表格寬度
2. 設(shè)置表格高度
3. 使用百分比設(shè)置大小

CSS中如何設(shè)置表格大小

在CSS中，我們可以通過多種方式設(shè)置表格的大小，以下是一些基本的方法和技巧。

設(shè)置表格寬度

在CSS中，我們可以使用width屬性來設(shè)置表格的寬度，這個(gè)屬性可以應(yīng)用于整個(gè)表格，或者單獨(dú)應(yīng)用于表格中的行（tr）或單元格（td）。

table {
  width: 50%; /* 設(shè)置表格寬度為容器寬度的50% */
}

或者針對(duì)特定的行或單元格進(jìn)行設(shè)置：

tr#myRow {
  width: 300px; /* 設(shè)置特定行的寬度 */
}
td {
  width: 20%; /* 設(shè)置單元格寬度為其父元素寬度的20% */
}

設(shè)置表格高度

類似地，我們可以使用height屬性來設(shè)置表格的高度，這個(gè)屬性也可以應(yīng)用于整個(gè)表格，或者單獨(dú)應(yīng)用于行或單元格。

table {
  height: 300px; /* 設(shè)置表格高度為300像素 */
}
tr#myRow {
  height: 50px; /* 設(shè)置特定行的高度 */
}
td {
  height: 50%; /* 設(shè)置單元格高度為其父元素高度的50% */
}

使用百分比設(shè)置大小

除了使用像素值外，我們還可以使用百分比來設(shè)置表格的大小，這樣，表格的大小會(huì)根據(jù)其父元素的大小動(dòng)態(tài)調(diào)整。

table {
  width: 80%; /* 設(shè)置表格寬度為其父元素寬度的80% */
  height: 50%; /* 設(shè)置表格高度為其父元素高度的50% */
}

使用CSS設(shè)置表格大小是一種靈活且方便的方式，我們可以根據(jù)需要調(diào)整表格的大小，使其在各種設(shè)備和屏幕尺寸上都能良好地顯示，我們還可以利用CSS的其他特性，如邊框、背景色等，來進(jìn)一步增強(qiáng)表格的視覺效果。