码迷,mamicode.com
首页 > Web开发 > 详细

CSS继承、层叠和特殊性

时间:2017-09-26 12:54:56      阅读:179      评论:0      收藏:0      [点我收藏+]

标签:images   权重   分享   解决   cond   http   src   htm   port   

1.继承

(1)样式应用于某个特定的HTML标签元素,而且应用于其后代。

(2)但某些标签不适用,如border;

(3)例子:p{color:red;}设置了颜色

<p class="first">

 <p id="second">

效果一样。

2.特殊性

(1)当标签匹配多个样式,浏览器根据权值来判断适用哪种CSS样式,权值高就使用哪种。

(2)例子:

p{color:red;}
.first{color:green;}
<p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p>
“胆小如鼠”显示的是绿色的字体。
(3)规则:
技术分享

3.层叠

(1)层叠就是在html文件中对于同一个元素可以有多个css样式存在,当有相同权重的样式存在时,会根据这些css样式的前后顺序来决定,处于最后面的css样式会被应用。

(2)例子:

p{color:red;}
p{color:green;}
<p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p>
(3)设置样式层次一致,最后文本显示绿色,后面覆盖了前面的。
4.重要性
(1)为某些样式设置最高权值,使用important解决。
(2)语法:p{color:red!important;}
(3)例子:
p{color:red!important;}
p{color:green;}
<p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p>
(4)原来是绿色覆盖了红色,现在是红色覆盖了绿色,因为红色设置了最高权值。

 

 

 

CSS继承、层叠和特殊性

标签:images   权重   分享   解决   cond   http   src   htm   port   

原文地址:http://www.cnblogs.com/carrier-sisi/p/7596074.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!