按一般论:
ID > Class > 标签

1.如以下样式:

1 <div id="id" class="class">选择器优先权</div>
2 #id{color:#aaa;}
3 .class{color:#bbb;}
4 div{color:#ccc;}

这里,最后输出 的结果为 #aaa;


2.如果把选择器改为:

1 #id{color:#aaa;}
2 #id .class{color:#bbb;}
3 div{color:#ccc;}

最后,这里输出的颜色为:#bbb;

3.但如果HTML改为:

1 <div id="id" class="class"><b>选择器优先权</b></div>
2 #id{color:#aaa;}
3 .class{color:#bbb;}
4 b{color:#ccc;}

这里最后输出结果即为:#ccc;

因为 #id与 .class 并没有直接作用于对象上,故最后的结果为 b 的 #ccc;

相关文章:

  • 2021-07-01
  • 2021-06-20
  • 2021-06-17
  • 2021-11-09
  • 2021-06-18
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
猜你喜欢
  • 2022-12-23
  • 2022-01-27
  • 2022-12-23
  • 2021-05-31
  • 2022-12-23
  • 2022-03-01
  • 2022-12-23
相关资源
相似解决方案