css基本选择武器
标签选择器（如：body,div,p,ul,li）
id选择器 （如：id="name",id="name_txt"）
类选择器（如class="name"）
后代选择器（如：#head .nav ul li 从父集到子孙集的选择器）
子元素选择器（如：div>p ,带大于号>）
伪类选择器（如：就是链接样式,a元素的伪类）
通配符选择器
什么是css选择器优先级
css选择器优先级是指在给html元素应用样式时，如果有多个css选择器同时指向了这个元素，那么优先级高的选择器的样式就会最终应用到这个元素上
css选择器优先级的计算方法
通过权重来计算得到优先级，主要分为三大类，从高到低的顺序是
ID选择器
类，伪类，属性选择器
标签类型和伪元素选择器
除了选择器以外，行内样式的优先级最高，但是他的权重可能会被！important覆盖
权重大小
!important可以覆盖行内样式的权重，所以它的权重最大
行内样式，权重为1000
ID选择器，权重为100
类、伪类、属性选择器，权重为10
标签类型和伪元素选择器，权重为1
通配符选择器对特殊性没有任何贡献，权重为0
!important>内联样式 > ID选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签类型选择器 = 伪元素选择器 > 通配符选择器
权重关系案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
div{
width: 400px;
height: 400px;
background-color: yellow;
margin: 200px auto;
}
ul{
list-style: none;
font-size: 40px;
padding:75px;
margin: 50px;
}
/* 权重为121 */
#container .menu li.item2{
color: coral;
}
/* 权重为121 */
#container li:nth-child(2).item2{
color: blue;
}
/* 权重为111 */
#container li.item2{
color: blueviolet;
}
/* 权重为11*/
li.item2{
color: aquamarine;
}
/* 权重为10 */
.item2{
color: red;
}
/* 1.不同写法样式引用顺序不同，权重越小会先引用，但是后面权重大的样式如果出现和前面相同的属性，就会把之前的覆盖掉
2.如果权重相同，那么以定义顺序靠后的选择器优先 */
</style>
</head>
<body>
<div id="container">
<ul class= "menu">
<li id="item1" class="item1">优先级1</li>
<li class="item2">优先级2</li>
<li class="item3">优先级3</li>
</ul>
</div>
</body>
</html>
