如何在HTML中使用CSS填充单元格之间的边框间距颜色 [英] How to fill color in border spacing between cells in HTML using CSS

问题描述

我试图在HTML表格的垂直单元格间距（列）之间填充黑色，但无法弄清楚如何去做。这是我的代码

---

table，th，td {崩溃：分开; border-spacing：2px; border-style：solid; border-width：thin;}

< table> < TR> << th> Heading One< / th> < th>标题Two< / th> < th> Heading Three< / th> < / TR> < TR> < TD>苹果< / TD> < TD→10< / TD> < TD> $ 1.0 LT; / TD> < / TR> < TR> < TD>芒果< / TD> < TD> 12< / TD> < TD> $ 2.0< / TD> < / tr>< / table>

解决方案最好的方法是为表格添加背景色，并在字段中添加前景色。请参阅下文

  table，th，td {border-collapse：separate;边框间距：2px的; border-style：solid; border-width：thin;} table {background：＃000;} tr {background：#fff;}  

 < table>< tr>< th>< th> Heading One< / th> < th>标题Two< / th> <>< td> Apple< / td>< td> 10< / td>< td> 1.0美元< / td>< /tr><tr><td>Mango</td><td>12</td><td>$2.0</td></tr></table> 

I'm trying to fill black color between vertical cell spacing(columns) of a table in html but can't figure it out how to do it. Here is my code

---

table,
th,
td {
  border-collapse: separate;
  border-spacing: 2px;
  border-style: solid;
  border-width: thin;
}

<table>
  <tr>
    <th>Heading One</th>
    <th>Heading Two</th>
    <th>Heading Three</th>
  </tr>

  <tr>
    <td>Apple</td>
    <td>10</td>
    <td>$1.0</td>
  </tr>

  <tr>
    <td>Mango</td>
    <td>12</td>
    <td>$2.0</td>
  </tr>
</table>

解决方案

Best way to do this would be to add a background color to the table and a foreground color to the fields. See below

table, th, td
{
  border-collapse: separate;
    border-spacing:2px;
    border-style: solid;
    border-width:thin;
}
table{background:#000;}
tr{background: #fff;}

<table>
<tr><th>Heading One</th>
    <th>Heading Two </th>
    <th>Heading Three </th>
</tr>

<tr>
<td>Apple</td>
<td>10</td>
<td>$1.0</td>
</tr>

<tr>
<td>Mango</td>
<td>12</td>
<td>$2.0</td>
</tr>
</table>

这篇关于如何在HTML中使用CSS填充单元格之间的边框间距颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！