css怎麼去掉表格重複的邊框

在css中，可以使用border-collapse屬性來去掉表格中重複的邊框，該屬性可以設定表格邊框是折疊為單一邊框還是分開的，只需要將值設為collapse即可把重疊的邊框合併在一起，成為一個邊框，實現單線邊框的效果。

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

table表格設定邊框後的重疊問題

table{
 border-spacing: 0;
 border-collapse: collapse;
}
table td {          
 border: 1px solid #000;
 padding: 20px 30px;
}

在table表格中當我們新增了邊框，又把每個儲存格的邊距移除後，表單就會出現邊框重疊的問題，讓邊框線變粗，這時我們就可以設定border-collapse: collapse來設定邊框，它把重疊的邊框合併在一起，成為一個邊框，實作單線邊框的效果。

效果圖：

說明：

border-collapse 屬性設定表格的邊框是否合併為一個單一的邊框，還是像在標準的HTML 中那樣分開顯示。

屬性值：

• separate    預設值。邊框會被分開。不會忽略 border-spacing 和 empty-cells 屬性。   

• collapse    如果可能，邊框會合併為單一的邊框。會忽略 border-spacing 和 empty-cells 屬性。      

相關介紹：

#border 是邊框屬性的簡寫屬性。

CSS border 屬性用來指定元素邊框的樣式、寬度和顏色。

可以設定的屬性分別（依序）：border-width, border-style 和 border-color。

也可以只設定一個值，例如 border：＃FF0000; 是正確的，其他值會設定成對應屬性的初始值。

語法格式

可以使用下面列出的一個，兩個或三個值來指定border 屬性，值的順序無關緊要：

/* 边框样式 */
border: solid;
/* 边框宽度 | 边框样式 */
border: 2px dotted;
/* 边框样式 | 边框颜色 */
border: outset #f33;
/* 边框宽度 | 边框样式 | 边框颜色 */
border: medium dashed green;
/* 全局值 */
border: inherit;
border: initial;
border: unset;

注意：如果邊框的樣式未定義，它將不可見。這是因為樣式預設 為none。

相關推薦：《css影片教學》

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