html - 按 ID 为元素设置样式有效，按类别无效

Question

我正在使用 twitter 引导表，并试图将我自己的样式（背景颜色）分配给表的元素。

什么有效：分配id="foo"给每个 <td> 元素，然后放入#foo { ... }我的样式表中。

什么不起作用：分配class="foo"给每个 <td> 元素，然后放入.foo { ... }我的样式表中。我还尝试通过在我的样式表中放置td { ... }和来设置tr td { ... }样式。都没有奏效。

为什么会这样？我想也许周围可能有一个同名的类，但除非引导程序有一个名为“.asdfasdfasdfasdf”的类，否则我很确定情况并非如此。

Answer 1

没有看到任何实际代码很难说，但我猜你有一个覆盖你的类的更高特异性的 CSS 规则。要跟踪类似的内容，请在浏览器中使用“ inspect ”来查看哪个规则正在覆盖您的 CSS 类。

CSS 优先级确实有效，并且按如下顺序排列：

• 元素，伪元素：0,0,0,1
• 类，伪类，属性：0,0,1,0
• 编号：0,1,0,0
• 内联样式：1,0,0,0

例如：如果你有这样的规则，#body table tr td {}它的优先级总是比tr td {}甚至高于body table tr td {}or tr td.someClass {}。

您可以在此页面上阅读有关特殊性的更多信息：了解 CSS 中的样式优先级：特殊性、继承和级联。

Answer 2

尝试将您班级中的 css 值标记为重要。

.foo { 
     border: 1px solid black !important; 
}