您的位置:首页 > Web前端 > CSS

css选择器及优先级算法

2011-03-13 17:36 218 查看
css命令在读取时是按照其优先级的高低的先后顺序来解读的,当优先级相同时是按照其css命令写的先后顺序来读取的,即后面的css覆盖(前后css属性设置不同时)或继承(前后css属性设置相同或后面未设置该css属性时)前面的css命令。下面对html中类选择器、ID选择器、后代选择器、群组选择器等,以及选择器的优先级的计算总结一下。
1、标签名选择器
CSS:
div {color:red;border:1px blue solid;}

span {float:right;}
2、类选择器

HTML:
<div class="test">类选择器</div>
CSS:
.test {color:red;border:1px blue solid;}
3、ID选择器

HTML:
<div id="test">ID选择器</div>
CSS:
#test {color:red;border:1px blue solid;}
4、直接在标签中加入style
html:
<div style="border:1px yellow solid;">标签中直接加入style</div>

选择器的优先级的计算:
直接加入style的优先级最高相当于数学计算的千位,用a表示;ID选择器的优先级次之,用b表示;class类选择器的优先级次之,用c表示;标签名选择器的优先级次之,用d表示。
优先级的计算公式为:优先级=a*1000+b*100+c*10+d.
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: