内联样式表(InLine style)>内部样式表(Internal style sheet)>外部样式表(External style sheet)

例外:但如果外部样式表放在内部样式表下边引用,则外部样式表>内部样式表;

1,内联样式表权值为1000;

2,ID选择器的权值为100;

3,Class类选择器的权值为10;

4,HTML标签选择器的权值为1;

具体代码如下:

XML/HTML Code 复制内容到剪贴板 <!DOCTYPE html>   < html   lang = "en" >    < head >         < meta   charset = "UTF-8" >         < title > CSS样式权值 </ title >         < style >            body{                font-size: 20px;                font-weight: 900;             }            h3{                color: yellow;            }            #redP p{                /*权值100 1 = 101 */                color: #f00;                /*红色*/            }            #redP p.red em{                /*权值100 1 10 1 = 112 */                color: #00f;                /*蓝色*/            }            #redP .red em{                /*权值100 10 1 = 111 */                color: #0ff;                /*亮蓝色*/            }                  #redP p span em{                /*权值100 1 1 1 = 103 */                color: #ff0;                /*黄色*/            }         </ style >         < link   rel = "stylesheet"   href = "style.css" >    </ head >    < body >         < h3 > 例外:外部样式表 > 内部样式表 </ h3 >         < div   id = "redP" >             < p   class = "red" >                 < span >                     < em > emred </ em >                 </ span >             </ p >             < p > red </ p >         </ div >    </ body >    </ html >   

以上这篇浅谈CSS样式权值就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。