如何在HTML中更改表格边框样式/大小/颜色

很抱歉，我发布了这个问题，但现在我已经走到了死胡同

正如您所看到的，这个表格有不同的边框大小和颜色，加上单元格背景的类似情况也很好

有人能告诉我如何用.html制作这个表格吗？ 记事本文档中的表代码应该是什么？ 我完全迷失在这些方面：单元格间距=“0”单元格填充=“4”、…（到目前为止等等）

也许用html创建这个表不是不可能的

嗯，对于熟练的程序员来说，这听起来可能很有趣，但我不知道如何处理它，尤其是当我在工作中遇到困难的表格时

---

您可以设置每个单元格的样式。例如：

<table border="1">
    <tr>
        <th>Day</th>
        <th class="border-top-blue">1</th>
        <th class="bg-red">2</th>
    </tr>
    <tr>
        <td>Speed</td>
        <td>row 1, cell 2</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>Total</td>
        <td class="bg-yellow border-dotted">200</td>
        <td>row 2, cell 2</td>
    </tr>
</table>

---

这样你就可以改变边框，背景色，大小等。希望你明白了

您可以在html文件中使用它

<tr>
    <td class = "class1>text</td>
    <td class = "class2>text</td>
</tr>

文本

然后有一个css文件 .1级 { 背景色：红色； 边框：纯绿2px； ` } 或者您可以将树结构与子元素一起使用

---

顺便说一下，第一列可能是th而不是td，我不知道单元格的确切颜色或宽度，但下面是该表的结构。我知道桌子有多棘手。我希望这对你有帮助

HTML

---

谷歌“html制表器”，你会得到很多免费网站来帮助你解决这个问题。这里有一个首先出现的问题。不幸的是，quackit.com无法帮助解决这个“尺寸”问题。里面只有简单的桌子=（你必须做一些阅读和研究，不要指望有人为你做这些。这里有一个很好的例子，解释了你想知道的关于html格式表的一切。为什么要混合内联样式和CSS类？@JonP覆盖类中的一些边框。这是一个有趣的边框组合。

<tr>
    <td class = "class1>text</td>
    <td class = "class2>text</td>
</tr>

    <table id="sampleTable" width="300" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="150" class="graybg-blackborder" style="border-top: 2px #000 solid;">DAY</td>
    <td class="graybg-blackborder" style="border-top: 2px blue solid; border-left: none;">1</td>
    <td class="redbg-blackborder" style="border-top: 2px #000 solid; border-left: none;">2</td>
  </tr>
  <tr>
    <td width="150" class="graybg-blackborder">Speed</td>
    <td class="dottedBottomBorder rightThinBorder">1.20kb/h</td>
    <td class="dottedBottomBorder rightThinBorder">1.00kb/h</td>
  </tr>
  <tr>
    <td width="150" class="graybg-blackborder " style="border-bottom: 2px #000 solid;">Total</td>
    <td class="rightThinBorder yellowBg dottedBottomBorder">200</td>
    <td class="rightThinBorder thickBottom">220</td>
  </tr>
</table>

    #sampleTable {
    text-align:center;
}
.graybg-blackborder {
    background: #ccc;
    border-left: 2px #000 solid;
    border-right: 2px #000 solid;
    border-top: 1px #000 solid;
    border-bottom: 2px #000 solid;
    font-weight: bold;
}
.redbg-blackborder {
    background: red;
    border-left: 2px #000 solid;
    border-right: 2px #000 solid;
    border-top: 1px #000 solid;
    border-bottom: 2px #000 solid;
    font-weight: bold;
}
.dottedBottomBorder {
    border-bottom: #000 1px dotted;
}
.rightThinBorder {
    border-right: 1px #000 solid;
}
.yellowBg {
    background-color: yellow;
}
.thickBottom {
    border-bottom: 2px #000 solid;
}