html – 如何使类优先于一个id?

前端之家收集整理的这篇文章主要介绍了html – 如何使类优先于一个id?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
<div id="normal" class="wider">

</div>

但这不行! blah的宽度取消了“更广泛”的类。

解决方法

你那里有一个 CSS specificity的问题。

.wider具有0,1,0的特异性,而#normal具有0,0。你不能用任何其他ID(或内联定义,但这不是这里)除了ID。

如果你不能在#normal选择器中放置所需的宽度声明,那么我会推荐的是将它放在#normal.wider中,或者如果不可能,请使用一个标识的容器,比如#container,层次结构(可能是身体上的ID),并用#container .wider替换.wider。这个新的选择器将具有0,0的特异性,这比0.1,0有点高。

使用!重要也会奏效,但只能用作最后的手段。

例:

<div id="container" class="wrapper">
    <div id="normal" class="wider">
</div>

对于这个HTML片段,一些可能的选择器按照特殊性的降序将是:

CSS Selector         -> Specificity
---------------------------------------
#container #normal   -> 0,2,0
#container .wider    -> 0,0 // These two have the same specificity so
#normal.wider        -> 0,0 // the last declared value will be used
#normal              -> 0,0
.wrapper .wider      -> 0,0
.wider               -> 0,0

猜你在找的HTML相关文章