CSS的选择器类型
css:
css选择器：
1.元素选择器：
2.类选择器：
html
<div class="box"></div>
css:
.box{}
3.id选择器
html
<div id="container"></div>
css:
#container{}
注：同一个id选择器只能命名一次，因为id具有唯一性
4.后代选择器：选取的是父元素下的所有子元素
ul li{}
5.子代选择器：父元素下的直接子元素
ul>li{}
6相邻兄弟选择器
.good+li
7.通用兄弟选择器
good~li
8.结构伪类选择器
-ul>li:first-child{} 第一个孩子
- ul>li:last-child{} 最后一个孩子
- ul>li:nth-child(n){} 第n个孩子
<html>
<head>
<meta charset="utf-8"/>
<title>结构伪类选择器</title>
<style>
.list>li:first-child{
background:red;
}
.list>li:last-child{
background:green;
}
.list>li:nth-child(2){
background:yellow;
}
.list>li:nth-child(3){
background:blue;
}
.list>li:nth-child(4){
background:gray;
}
</style>
</head>
<body>
<ul class="list">
<li>第一个li</li>
<li>第二个li</li>
<li>第三个li</li>
<li>第四个li</li>
<li>第五个li</li>
</ul>
</body>
</html>
