华南俳烁实业有限公司

CSS 表格屬性可以幫助您極大地改善表格的外觀。

表格邊框

如需在 CSS 中設置表格邊框，請使用 border 屬性。

下面的例子為 table、th 以及 td 設置了藍色邊框：

table, th, td
  {
  border: 1px solid blue;
  }
	 	

請注意，上例中的表格具有雙線條邊框。這是由于 table、th 以及 td 元素都有獨立的邊框。
如果需要把表格顯示為單線條邊框，請使用 border-collapse 屬性。
折疊邊框
border-collapse 屬性設置是否將表格邊框折疊為單一邊框：
table
  {
  border-collapse:collapse;
  }

table,th, td
  {
  border: 1px solid black;
  }
表格寬度和高度
通過 width 和 height 屬性定義表格的寬度和高度。
下面的例子將表格寬度設置為 100%，同時將 th 元素的高度設置為 50px：
table
  {
  width:100%;
  }

th
  {
  height:50px;
  }
表格文本對齊
text-align 和 vertical-align 屬性設置表格中文本的對齊方式。
text-align 屬性設置水平對齊方式，比如左對齊、右對齊或者居中：
td
  {
  text-align:right;
  }
vertical-align 屬性設置垂直對齊方式，比如頂部對齊、底部對齊或居中對齊：
td
  {
  height:50px;
  vertical-align:bottom;
  }
表格內邊距
如需控制表格中內容與邊框的距離，請為 td 和 th 元素設置 padding 屬性：
td
  {
  padding:15px;
  }
表格顏色
下面的例子設置邊框的顏色，以及 th 元素的文本和背景顏色：
table, td, th
  {
  border:1px solid green;
  }

th
  {
  background-color:green;
  color:white;
  }
CSS Table 屬性
屬性
描述
border-collapse
設置是否把表格邊框合并為單一的邊框。
border-spacing
設置分隔單元格邊框的距離。
caption-side
設置表格標題的位置。
empty-cells
設置是否顯示表格中的空單元格。
table-layout
設置顯示單元、行和列的算法。