CSS选择符优先级引起的样式失效_html/css_WEB-ITnose
程序员文章站
2022-04-11 16:32:58
...
选择符优先级带来的样式失效:
由于CSS选择符优先级可能引起某些样式失效,这个问题初学者可能会碰上,但是往往并不容易发现。
代码实例:
蚂蚁部落
- 蚂蚁部落
- div+css专区
- HTML专区
以上代码可以将li元素中的所有文字设置为绿色。这个时候可能需求变了,要将第一个li元素作为标题,需要改变一下它的元素。
代码如下:
蚂蚁部落
- 蚂蚁部落
- div+css专区
- HTML专区
尽管给第一个li元素单独设置了class类,并且规定了新的颜色,但是并没有生效。这就是由选择符优先级导致的。
只要将CSS代码做如下修改即可:
.mydiv li{color:green;} .mydiv .myli{color:blue;}
如需了解选择符优先级规则,可以参阅CSS选择符优先级一章节。
原文地址是:http://www.51texiao.cn/div_cssjiaocheng/2015/0519/1894.html
最为原始地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=4701
推荐阅读
-
css 样式用法的累积_html/css_WEB-ITnose
-
纯CSS3实现漂亮的价格表样式代码_html/css_WEB-ITnose
-
dropdownmenu,网页另存为之后,CSS样式变的很丑,求高手指点_html/css_WEB-ITnose
-
请教:网站的这种样式怎么写出来的_html/css_WEB-ITnose
-
dropdownmenu,网页另存为之后,CSS样式变的很丑,求高手指点_html/css_WEB-ITnose
-
css 样式用法的累积_html/css_WEB-ITnose
-
CSS样式的问题: .calss.class{color:Red}_html/css_WEB-ITnose
-
使用 CSS 去掉 iPhone 网页上按钮的超大圆角以及文本框圆角默认样式_html/css_WEB-ITnose
-
css实现的文本框focus获取焦点设置样式代码实例_html/css_WEB-ITnose
-
做这样的CSS文字阴影样式,该怎么做?_html/css_WEB-ITnose