HTML中选择器的使⽤及优先级⽐较1.id选择器，其中每个标签的id选择器的值是唯⼀的
<div id="text1">
css中⽤  #text1{    }
2.类选择器（class），可以有多个
<div class="text1"></div>
<div class="text1 text2"></div>
css中⽤  .text{}
3.后代选择器
⽐如要是选定<li></li>则
<ul>
<li></li>
</ul>
css中⽤: ul li{  }
4.⼦元素选择器，还是上个列⼦(注意只能下⼀级，不能下下级)
css中⽤ ul>li{  }
5.交集选择器
<ul>
<li class="text"></li>
<li></li>
</ul>
css中⽤:  li.text{}
6.并集选择器
<div></div>css样式表优先级最高
<p></p>
css中⽤:  div,p{ }
优先级：
⾏内样式>id选择器>类选择器>标签选择器
1<!DOCTYPE html>
2<html>
3<head>
4<meta charset="utf-8"/>
5<title></title>
6<style type="text/css">
7            .box1{color: aqua;}
8            #box2{ color: blueviolet;}
9            .box3 p .box4{color: blue;}
10            div>h3{color: darkslategray;}
11</style>
12</head>
13<body>
14<div class="box1">类选择器测试</div>
15<div id="box2">id选择器测试</div>
16<div class="box3">
17<p><span class="box4">后代选择器</span></p>
18<h3>⼦元素选择器</h3>
19</div>
20</body>
21</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。