html代码怎么给表格加颜色

在网页设计中，表格是最为常见的元素之一，可以用来展示各种数据。如果想让表格更加美观，就需要样式化表格，将其改变为不同的颜色。下面介绍一种简单的方法，使用 HTML 代码给表格加颜色。

table border="1">
      tr>
        th>
    姓名/th>
        th>
    年龄/th>
        th>
    性别/th>
      /tr>
      tr>
        td>
    小明/td>
        td>
    18/td>
        td>
    男/td>
      /tr>
      tr>
        td>
    小红/td>
        td>
    20/td>
        td>
    女/td>
      /tr>
    /table>
    

以上是一个简单的表格代码，有一个表头和两个数据行。我们要对这个表格进行样式化，加上不同的颜色。首先可以给表格加上一个 CSS 类，例如 color-table，在 CSS 中为该类设置样式。

table border="1" class="color-table">
      tr>
        th>
    姓名/th>
        th>
    年龄/th>
        th>
    性别/th>
      /tr>
      tr>
        td>
    小明/td>
        td>
    18/td>
        td>
    男/td>
      /tr>
      tr>
        td>
    小红/td>
        td>
    20/td>
        td>
    女/td>
      /tr>
    /table>

在 CSS 中，可以为这个表格类设置背景色、字体颜色等样式。例如，让表头显示为灰色，数据行显示为白色。

.color-table th {
      background-color: gray;
      color: white;
}
.color-table td {
      background-color: white;
      color: black;
}
    

上述代码中，color-table 为表格添加了样式，th 和 td 分别对应表头和数据行，为其设置不同的颜色。

通过以上方法，我们可以为表格添加不同的颜色，让其更具美观性和可读性。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！