1、优先级是指如果多个选择器作用于同一个元素时,CSS的处理规定;
2、对于优先级CSS总的原则是:越特殊的样式,优先级越高;
3、具体的说,优先级规则是:!important>行内样式>ID样式>类别样式>标记样式,可参考下图:
4、通过优先级规则我们可以知道:如果子元素定义的样式和父元素定义的样式冲突,则以子元素自己的样式为准;如果没有发生冲突,则子元素则继承父元素的样式风格;
5、特别的,继承来的样式的优先级要比元素具有的默认优先级低,如下面这个例子:
1 <style type="text/css" > 2 /*body标记选择器*/ 3 body{ 4 text-align: center; 5 font-size: 12px; 6 text-decoration: underline; 7 } 8 /*em标记选择器*/ 9 em{ 10 font-weight: bold; 11 font-size:30px; 12 color: red; 13 } 14 /*自定义了一个名为right的类选择器*/ 15 .right{ 16 text-align: right; 17 color: green; 18 font-weight: bold; 19 } 20 </style> 21 22 <body> 23 <h2>重视大脑的学习指南</h2><!--因<h2>标记自己有关于字体大小的样式,所以没有继承<body>标记关于字体大小的12px规定--> 24 <p>网页设计之CSS</p><!--完全继承了父元素<body>选择器的样式--> 25 <p><em>从零开始</em>学习网页设计</p><!--“从零开始”以自身的<em>标记选择器的样式为准,而“学习网页设计”继承了父元素<body>选择器的样式--> 26 <p class="right">CSS的优先性和继承性</p><!--自定义的样式选择器,优先级高于标记选择器--> 27 </body>