美文网首页我爱编程
章节九、CSS的继承、层叠和特殊性

章节九、CSS的继承、层叠和特殊性

作者: 神游加发呆 | 来源:发表于2018-05-25 10:28 被阅读0次

特殊性:
浏览器是根据权值来判断使用哪种css样式的,权值高的就使用哪种css样式。
标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100。
如:

p{color:red;} /*权值为1*/
p span{color:green;} /*权值为1+1=2*/
.warning{color:white;} /*权值为10*/
p span.warning{color:purple;} /*权值为1+1+10=12*/
#footer .note p{color:yellow;} /*权值为100+10+1=111*/

层叠就是在html文件中对于同一个元素可以有多个css样式存在,当有相同权重的样式存在时,会根据这些css样式的前后顺序来决定,处于最后面的css样式会被应用。
有些特殊的情况需要为某些样式设置具有最高权值,可以使用!important来解决。
如下代码:

p{color:red!important;}
p{color:green;}
<p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p>

这时 p 段落中的文本会显示的red红色。
注意:!important要写在分号的前面

相关文章

  • 章节九、CSS的继承、层叠和特殊性

    特殊性:浏览器是根据权值来判断使用哪种css样式的,权值高的就使用哪种css样式。标签的权值为1,类选择符的权值为...

  • CSS 自学笔记(中)

    传送门: CSS 自学笔记(上) CSS 自学笔记(中) CSS 自学笔记(下) 继承、层叠和特殊性 继承 CSS...

  • 初始CSS.下(记录下方便搜索查看)

    一、CSS的继承、层叠和特殊性 1.1、继承 CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它...

  • css继承、层叠和特殊性

    css继承、层叠和特殊性 1、继承css的某些样式具有继承性 那么什么是继承呢?继承是一种规则,它允许样式不仅应用...

  • CSS继承、特殊性和层叠

    1.继承 CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标...

  • 慕课网HTML+CSS基础教程(9-10章)2.0版

    一、CSS继承、层叠和特殊性 1、继承允许某些样式继承到其后代子元素比如color可继承,border不能继承。2...

  • css的继承、层叠和特殊性

    css的继承、层叠和特殊性 继承 css的某些样式是具有继承性的,继承是一种规则,它允许样式不仅应用于某个特定的h...

  • css的继承、层叠和特殊性

    1.css的继承 1-1, p { color: #2f2 } 以上p标签的设置不仅仅应用于p标签,还应用于p...

  • CSS的继承、层叠和特殊性

    一、继承 概念:CSS的某些样式是具有继承性的,继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且...

  • CSS继承、层叠、特殊性

    1.CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标签元素...

网友评论

    本文标题:章节九、CSS的继承、层叠和特殊性

    本文链接:https://www.haomeiwen.com/subject/qojyjftx.html