Html 我可以使用 CSS 为表格列着色而不为单个单元格着色吗

发布于12月02日

有没有一种方法可以一直为列的跨度着色.请参见下面的示例:

<table border="1">
  <tr>
    <th>Motor</th>
    <th colspan="3">Engine</th>
    <th>Car</th>
    <th colspan="2">Body</th>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
    <td>6</td>
    <td>7</td>
  </tr>
  <tr>
    <td>7</td>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
    <td>6</td>
  </tr>
</table>

我正在寻找一种更好的方法(代码更少，不是单独着色)来上色，例如，"引擎"和"主体"跨度，包括它们下面#DDD个单元格中的所有单元格

<style>
  .color {
    background-color: #DDD
  }
</style>
<table border="1">
  <tr>
    <th>Motor</th>
    <th colspan="3" class="color">Engine</th>
    <th>Car</th>
    <th colspan="2" class="color">Body</th>
  </tr>
  <tr>
    <td>1</td>
    <td class="color">2</td>
    <td class="color">3</td>
    <td class="color">4</td>
    <td>5</td>
    <td class="color">6</td>
    <td class="color">7</td>
  </tr>
  <tr>
    <td>7</td>
    <td class="color">1</td>
    <td class="color">2</td>
    <td class="color">3</td>
    <td>4</td>
    <td class="color">5</td>
    <td class="color">6</td>
  </tr>
</table>

<table> <colgroup> <col class="grey" /> <col class="red" span="3" /> <col class="blue" /> </colgroup> <thead> <tr> <th>#</th> <th colspan="3">color 1</th> <th>color 2</th> </tr> </thead> <tbody> <tr> <th>1</th> <td>red</td> <td>red</td> <td>red</td> <td>blue</td> </tr> <tr> <th>2</th> <td>red</td> <td>red</td> <td>red</td> <td>blue</td> </tr> </tbody> </table>

Html 我可以使用 CSS 为表格列着色而不为单个单元格着色吗

推荐答案

Html相关问答推荐

有没有可能一个按钮，有焦点，然后再次点击它清除它的焦点，只是使用css？

我如何 Select 外部html文件元素作为选项，并显示在一个div与jQuery？

在css嵌套 Select 器中，尾随的`&；‘是什么意思？

如何在所有屏幕大小下使带有背景图像的伪元素作为标题的衬底？

如何更改计时器S输入的Angular 字体大小？

Bootstrap nav没有崩溃

Flexbox在元素之间造成了太大的差距

我无法动态嵌入Instagram帖子，因为无法分配Instagram固定链接

使用不同字体对齐元素

Tailwind CSS 忽略我的元素的填充

为什么 `：：before` 在使用内容 `url(svg)` 时会增加一些高度

如何垂直平移一个元素，使其新位置位于另外两个元素之间？

ul li 右侧的 Bootstrap 加载微调器

调整窗口大小时文本重叠导航栏

为什么 css position：fixed 不适用于对话框标签？

如何并排放置
和
的定义列表，但如果
变长，
会向下移动？

如何使用 html 和 css 为卡片创建此背景框架

调整大小时 CSS 溢出

如何向上移动图像并溢出图像的一部分而另一部分不溢出

使用 CSS 的发光边框动画没有流畅的过渡