css类、ID和标签同时作用于一个对象时,哪一个优先级高?
3个回答
展开全部
按一般伦:
ID > Class > 标签
如以下样式:
HTML为:
<div id="id1" class="c1">选择器优先权</div>
#id1{color:#f00;}
.c1{color:#0f0;}
div{color:#00f;}
这里,最后输出 的结果为 #f00;
如果把选择器改为:
#id1{color:#f00;}
#id1 .c1{color:#0f0;}
div{color:#00f;}
最后,这里输出的颜色为:#0f0;
但如果HTML改为:
<div id="id1" class="c1"><b>选择器优先权</b></div>
CSS为:
#id1{color:#f00;}
.c1{color:#0f0;}
b{color:#00f;}
这里最后输出结果即为:
#00f;
因为 #id1与 .c1 并没有直接作用于对象上,故最后的结果为 b 的 00f;
ID > Class > 标签
如以下样式:
HTML为:
<div id="id1" class="c1">选择器优先权</div>
#id1{color:#f00;}
.c1{color:#0f0;}
div{color:#00f;}
这里,最后输出 的结果为 #f00;
如果把选择器改为:
#id1{color:#f00;}
#id1 .c1{color:#0f0;}
div{color:#00f;}
最后,这里输出的颜色为:#0f0;
但如果HTML改为:
<div id="id1" class="c1"><b>选择器优先权</b></div>
CSS为:
#id1{color:#f00;}
.c1{color:#0f0;}
b{color:#00f;}
这里最后输出结果即为:
#00f;
因为 #id1与 .c1 并没有直接作用于对象上,故最后的结果为 b 的 00f;
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询