时间戳

首页 > 解决方案 > 如何专门为一个表类设置 th 和 td 样式？

html - 如何专门为一个表类设置 th 和 td 样式？

问题描述

我有一个非常烦人和莫名其妙的问题。我的网站有两种不同类别的表格。一个没有边界，另一个有。但无论我做什么，我都无法将 th 和 td 样式与另一个表分开。

第一个表没有类样式；我默认什么。

第二个表有：

table.t01, th, td {
   border: 4px solid black;
   border-collapse: collapse;
}

但是，这会影响第一个表的 th 和 td 的样式。哇。

我怎么解决这个问题？

标签： htmlcss

解决方案

通过在选择器中使用逗号，您是在说“这种风格适用于任何table带有 classt01的，但也适用于 ANYth和 ANY td”。

这对于合并许多具有相同样式的元素的样式很有用。例如，以下是等价的：

// The verbose way
th { color: red; }
td { color: red; }
p.red { color: red; }
div#firstred { color: red; } 

// The concise way
th, td, p.red, div#firstred { color: red; }

如果您真正要寻找的是为with class定义样式th和td后代，只需用空格分隔and /选择器的术语：tablet01tablethtd

尝试：

table.t01 th, table.t01 td {
   border: 4px solid black;
   border-collapse: collapse;
}

推荐阅读