CSS文件忽略

Question

我试图重写以下引导价值

.table > thead > tr > td.danger, .table > tbody > tr > td.danger, .table > tfoot > tr > td.danger, .table > thead > tr > th.danger, .table > tbody > tr > th.danger, .table > tfoot > tr > th.danger, .table > thead > tr.danger > td, .table > tbody > tr.danger > td, .table > tfoot > tr.danger > td, .table > thead > tr.danger > th, .table > tbody > tr.danger > th, .table > tfoot > tr.danger > th { 
background-color: #f2dede; 
} 

所以我创造了自己的CSS文件有以下

.myhead { 
    background-color: blue; 
    color: white; 
} 

这里的HTML

<tr class="danger"> 
    <th class="myhead" nowrap="nowrap">Test</th> 

</tr> 

现在为了增加赢得引导值的特殊性，我决定将CSS修改为遵循

.myhead, #myhead1, #myhead2, #myhead3, #myhead4 { 
    background-color: blue; 
    color: white; 
}  

的问题时，我做的是，浏览器完全忽略的CSS文件，我甚至不能看到我的“myhead”上课的时候我检查网页。以前，当我检查文件时，我可以清楚地看到我的CSS文件被考虑在内，但该属性被bootstrap覆盖（穿透）。

这里有什么问题？

更新：根据Berendschot的建议更新昏迷，我现在可以看到我的CSS文件，但仍然无法覆盖bootstarp。根据我的计算，我应该优先考虑410（10 + 100 + 100 + 100 + 100）

Answer 1

您应该使用逗号来分隔CSS中的类和id。

.myhead #myhead1 #myhead2 #myhead3 #myhead4中的样式仅适用于拥有所有这些类和ID的元素。通过添加逗号，样式将应用于至少有一个元素的所有元素。

实施例：div, p选择所有<div>元件和所有<p>元素。

更多关于CSS Selectors。

---

如果你想覆盖一定的风格，你必须确保你嵌入类第一次申报后，或使用!important。

关于使用的更多信息!important。

Answer 2

它依赖于原始CSS，但你可能要添加!important你的CSS规则来覆盖其他类：

.myhead, #myhead1, #myhead2, #myhead3, #myhead4 { 
    background-color: blue !important; 
    color: white !important; 
}  

Answer 3

你的选择关系.myhead #myhead1 #myhead2 #myhead3 #myhead4它是怎么写的期待是#myhead4是#myhead3孩子，并且#myhead3是#myhead2等的孩子。如果在您的文档中不是这种情况，那么样式将永远不会被使用。

<th class="myhead"> 
    <div id="myhead1"> 
    <div id="myhead2"> 
    <div id="myhead3"> 
    <div id="myhead4">This would have a blue background with white text</div> 
    </div> 
    </div> 
    </div> 
<th> 

使用!important在某些领域是有用的，但问题可能来自它，有时会难以调试。我对你的标记的建议;

<tr class="danger"> 
    <th class="myhead" nowrap="nowrap">Test</th> 
</tr> 

使用selector.class {...}像这样。

th.myhead { 
    background-color: blue; 
    color: white; 
} 

这样，所有<th>元素与类的myhead将使用声明的风格。 ID s在每个页面上都是唯一的，所以它不是必需的，可以定义为＃id1，＃id2等等......希望这有助于。