如何創建一個比表格中的單元格邊框更厚的外邊框？

我有一些表格，我希望這些表格的四個外邊框比分割單個單元格的邊框更粗。除了手動更改每個發生邊界外部邊界厚度的邊界厚度（這根本沒有效率），我該怎麼做？如何創建一個比表格中的單元格邊框更厚的外邊框？

我想嘗試的另一件事是，雖然現在所有的邊框都摺疊了，但我可能希望這些外框不會摺疊（而不是加厚）。但我不知道如何解決這個問題。

複雜的事情是，我只想用我的文檔中的一些表做到這一點。我整個文檔都有一大堆 - 我希望大多數人都有1px的厚度。但是有一些特殊的表格需要3px的外部厚度。那麼我該如何在CSS中做到這一點，而不會搞亂其他表？

任何地方，這裏是一個示例表我要加厚的外邊框：

<table> 
<tbody> 
<tr><th colspan="2">Quest Complete</th> 
</tr> 
<tr> 
<td colspan="2">Legend of the Sage</td> 
</tr> 
<tr> 
<td colspan="2">Nopon Sage<br/><br/>Ask a child in Frontier Village to tell you why the<br/>Nopon Sage is so great.<br/><br/><br/>You understand a little better why the<br/>Nopon Sage is so great.</td> 
</tr> 
<tr> 
<td style="width:165px">4500 G<br/>1500 EXP<br/><br/></td> 
<td style="width:165px">Poison Plus V<br/>Revival HP Up III<br/><br/></td> 
</tr> 
</tbody> 
</table>

（是的，這是一個視頻遊戲的事情= P）

這裏就是我有我CSS樣式表：

table {width: 360px; border-collapse: collapse; background-color: #f0f0f0} 
table, th, td {border: 1px solid black; font-size: 14px; font-family: Helvetica; line-height: 1.25} 
th, td {padding: 3px}

來源

2016-08-19 Andrew Anderson

它覆蓋CSS，根據優先級進行調整。在你的場景中，你可以改變CSS到這個，

table, th, td {border: 1px solid black; font-size: 14px; font-family: Helvetica; line-height: 1.25} 
th, td {padding: 3px} 
table {width: 360px; border-collapse: collapse; background-color: #f0f0f0;border: 10px solid black;}

來源

2016-08-19 18:51:03

非常感謝，沙灣！這工作（特別是一旦我想出如何設置第二個CSS樣式）。但我正在考慮用分離的邊框而不是加厚的邊框。我如何做到這一點，所以外邊框是分開的，但單元格邊框保持摺疊狀態？那可能嗎？ –

您可以應用邊框類型，如實心，凹槽，虛線等[檢查此]（http://www.w3schools.com/cssref/pr_border-style.asp）如果您要設置外邊框使用div標籤桌子的父母。 –

[請參閱此]（http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_table_test）只需將CSS更改爲 table，th，td {border：1px solid black;} table {border： 5px純黑;} 除此之外，你可以使用邊界右邊界，左邊界等。 –

如何創建一個比表格中的單元格邊框更厚的外邊框？

回答

相關問題