css怎麼給表格設定邊框

css表格設定邊框的方法：1、使用border屬性為table元素新增邊框，語法「table{border:寬度樣式顏色;}」；2、使用border屬性為td元素新增邊框，語法「 td{border:寬度樣式顏色;}」。

本教學操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。

預設表格是沒有邊框的

<table>
	<tr>
		<td>商品</td>
		<td>价格</td>
	</tr>
	<tr>
		<td>T恤</td>
		<td>￥100</td>
	</tr>
	<tr>
		<td>牛仔褂</td>
		<td>￥250</td>
	</tr>
	<tr>
		<td>牛仔库</td>
		<td>￥150</td>
	</tr>
</table>

我們可以透過css來為表格新增邊框。

方法1：只對表格table標籤設定邊框

只對table標籤設定border（邊框）樣式，將讓此表格最外層table一個邊框，而表格內部不產生邊框樣式。

語法：

table{
	border: 1px solid red;
}

效果圖：

#方法2：對td設定邊框

對table表格td設定邊框樣式，表格物件內td將實現邊框樣式，但中間部分td會導致出現雙邊框。

語法：

td{
border: 1px solid red;
}

效果圖：

#如果覺得雙線效果不好看。可以設定：

table {
        border-collapse: collapse;
        
}

為表格（table）設定合併邊框模型（合併邊框），效果圖：

（學習影片分享： css影片教學）

以上是css怎麼給表格設定邊框的詳細內容。更多資訊請關注PHP中文網其他相關文章！