如何更改html表格内的边框大小？答案

【问题标题】：how to change border size inside html table?如何更改html表格内的边框大小？
【发布时间】：2021-08-16 11:46:01
【问题描述】：

我得到了这个简单表格的代码：

<table border="5" bordercolor="#F9864D" style="background-color:#EFEFEF" width="450" cellpadding="0" cellspacing="0">
<tr>
<td>Table Cell</td>
<td>Table Cell</td>
<td>Table Cell</td>
</tr>
<tr>
<td>Table Cell</td>
<td>Table Cell</td>
<td>Table Cell</td>
</tr>
<tr>
<td>Table Cell</td>
<td>Table Cell</td>
<td>Table Cell</td>
</tr>
</table>

如你所见，只有外边框厚，内边框薄.. 如何设置会影响整个表格的边框大小，使外部和内部相同？

谢谢。

【问题讨论】：

将边框值设为这样的边框 =“1”

标签： html html-table border tr

【解决方案1】：

您可以编辑 td 属性。

如果我们创建一个customTable 类，我们可以使用CSS 选择器来选择表格中的每个td 元素。现在，如果我们想创建更多表，我们可以创建一个具有不同类的新表，并与其他表分开编辑。

.customTable {
    border: 5px solid #F9864D;
    background-color: #EFEFEF; 
    width: 450px;
}

.customTable td {
  border: 5px solid #F9864D;
}

<table class="customTable" cellspacing="0" cellpadding="0">
    <tr>
    <td>Table Cell</td>
    <td>Table Cell</td>
    <td>Table Cell</td>
    </tr>
    <tr>
    <td>Table Cell</td>
    <td>Table Cell</td>
    <td>Table Cell</td>
    </tr>
    <tr>
    <td>Table Cell</td>
    <td>Table Cell</td>
    <td>Table Cell</td>
    </tr>
</table>

【讨论】：

我在哪里放：td {border:5px solid #F9864D; } ?在“风格”标签内？在html文件的头部？如果这个页面已经在 .css 文件中插入了 head 标签，会发生什么？如何以不会影响整个页面的方式为此表格设置特定样式？
嘿，我把答案改了更清楚，我想你这样理解会更好。我使用 CSS 选择器来选择自定义表格中的每个表格单元格。如果您想了解更多关于 CSS 选择器的信息，我发现 this w3schools page 非常有用。
现在当我将类添加到表格时，所有设置都适用于外边框，所以我需要为每个 td 添加另一个类？有没有办法添加一个会影响整个表 tds 的类？
是的，就是这样：.customTable td { border: 5px solid #F9864D; } 段代码。

【解决方案2】：

table, td {
  border: 1px solid #F9864D;
}

<table style="background-color:#EFEFEF" width="450" cellpadding="0" cellspacing="0">
<tr>
<td>Table Cell</td>
<td>Table Cell</td>
<td>Table Cell</td>
</tr>
<tr>
<td>Table Cell</td>
<td>Table Cell</td>
<td>Table Cell</td>
</tr>
<tr>
<td>Table Cell</td>
<td>Table Cell</td>
<td>Table Cell</td>
</tr>
</table>

【讨论】：