使用表格时，CSS 中边框的值是多少？答案

【问题标题】：What is the value in CSS for border when using tables?使用表格时，CSS 中边框的值是多少？
【发布时间】：2014-12-09 13:24:27
【问题描述】：

使用表格时，CSS 中的边框值是多少？例如：

这是我想要的样子。

<table border=4px  >
 <tr>
    <th>1</th>
    <th>1</th>
  </tr>
  <tr>
    <td>2</td>
    <td>2</td>
  </tr>
</table>

但我只想用 CSS 来做。所以我像这样尝试内联

<table style="
border-width: 4px;
    border-spacing: 3px;
    border-style: outset;
    border-color: gray;
    border-collapse: separate;
    background-color: white;
    border-width: 2px;
    padding: 1px;
    border-style: inset;
    border-color: gray;
    background-color: white;
    border-width: 2px;
" >
 <tr>
    <th>1</th>
    <th>1</th>
  </tr>
  <tr>
    <td>2</td>
    <td>2</td>

</tr>
</table>

当我这样做时，单元格边框消失了（至少在 Firefox 中）。我尝试使用这里的向导http://www.somacon.com/p141.php，但它没有帮助。无论我做什么，如果不使用"table border=1px"，我都无法让这些“内墙”出现？

【问题讨论】：

w3.org/Style/Tables/examples.html。您还需要将边框应用于单元格。 table, td, th { border: 4px outset gray; }
这就是我所缺少的。

标签： html css html-table

【解决方案1】：

我建议的第一件事是看看Here

现在，在您学习了基本的 CSS 以及如何使用样式，将“内部”边框应用到表格之后，您基本上可以将边框应用到单元格本身：

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

或单独：

table tr th,
table tr td{
    border-style: solid;
    border-width: 1px;
    border-color: black;
}

然后，为了摆脱单元格间距，您将其应用于表格本身：

table{
    border-collapse: collapse;
}

EXAMPLE

【讨论】：

【解决方案2】：

您可以在别处添加单独的样式标签：

    <style type="text/css">
    table tr td { 
        border: 4px gray solid;
    } 
    table tr th {
        border: 4px gray solid;
    }
    </style>

【讨论】：