                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

8-8通用选择器

两张图片红线部分，都设定了<body>内的标签元素样式，。为什么显示的是通用选择器的样式。这

是有什么优先级吗？具体的优先级怎么说

慕田峪0816849

2016-07-28

源自：初识HTML(5)+CSS(3)-升级版 8-8

关注问题我要回答

1440

操作

收起

4 回答

RecallGY 回答被采纳 +3 积分
2016-07-28

为了回答问题特地弄了个例子解释如下

这是 body标签与通用选择器的代码+网页实际效果

这是普通标签（如p）与通用选择器的代码加效果

显然一般来说!important>inline style>ID>class>tag 这个优先级比较是没错的

但是你这里触发了特殊性就是html、通配符和body节点的优先级作用范围，htm＞通配符>body节点

3 回复有任何疑惑可以回复我~

收起回答

慕桂英3588515

意思是不是p标签的优先级大于body标签？？

2016-07-28 回复有任何疑惑可以回复我~

慕田峪0816849 提问者

向你学习。

2016-07-28 回复有任何疑惑可以回复我~

RecallGY 回复慕桂英3588515

body是html优先级里面的一个特殊性的标签可以说所有标签选择器都比他优先

2016-07-28 回复有任何疑惑可以回复我~

查看1条回复

翻瑜
2016-07-28

通常我们可以将CSS的优先级由高到低分为六组：

　　1、无条件优先的属性只需要在属性后面使用 !important 。它会覆盖页面内任何位置定义的元素样式。当然，IE 6不支持这个属性，于是它也成为一种hack被很多人所熟知，真正使命被人淡忘。
　　2、第二高位的优先属性是在html中给元素标签加style。由于该方法会造成CSS的难以管理，所以不推荐使用。
　　3、第三级优先的属性是由一个或多个id选择器来定义的。例如 #id{margin:0;} 会覆盖 .classname{margin:3px;}。
　　4、第四级的属性由一个或多个类选择器、属性选择器、伪类选择器定义。如 .classname{margin:3px;} 会覆盖 div{margin:6px;}
　　5、第五级由一个或多个类型选择器定义。如 div{margin:6px;} 覆盖 *{margin:10px;} 。
　　最低一级的选择器是为一个通配选择器，用*{margin:10px;}这样的类型来定义。

1 回复有任何疑惑可以回复我~

收起回答

慕桂英3588515
2016-07-28

如果通用选择器和标签选择器共存的话，浏览器优先处理标签选择器的属性，然后再处理通用选择器。不知道对不对，求大神指正。

0 回复有任何疑惑可以回复我~

收起回答

慕田峪0816849 提问者

你看下这个：对html与body的一些研究与理解 « 张鑫旭-鑫空间-鑫生活 http://www.zhangxinxu.com/wordpress/2009/09/%e5%af%b9html%e4%b8%8ebody%e7%9a%84%e4%b8%80%e4%ba%9b%e7%a0%94%e7%a9%b6%e4%b8%8e%e7%90%86%e8%a7%a3/

2016-07-28 回复有任何疑惑可以回复我~

RecallGY

是的 body比较特殊而已

2016-07-28 回复有任何疑惑可以回复我~