CSS基本选择器
1、标签选择器
（1）通过标签选择元素
即给定< div >在< body >中设置< div >文字内容< /div >
再在< head >标签中设置样式
/*标签选择器*/
div{
font-size : 30px; color : red;
}
/*<div>标签在<header>标签中，标签选择器仍可选中*/
<header>
<div>文字内容</div>
</header>
（2）无论标签隐藏多深，标签选择器都可选中
（3）标签选择的是所有，不是一个
（4）所有标签都可以使用标签选择器选中（< div >标签只能选中< div >标签，< p >标签只能选中< p >元素）
ID选择器
（1）id属性是标签属性，任何元素都可以有id属性
（2）使用id选择器时，要在id值前加上“#”
/*id选择器*/
<style type = "text/css">
#one{
color : red;
}
</style>
<body>
<ul>
<li id = "one">文字内容</li>
</ul>
</body>
（3）id选择器只能选中一个元素，同一个页面要保证id的唯一值，不同元素有相同id也是不可的
（4）定义id时，必须要以字母开头，可包含数字，下划线等符号
（5）定义id时，不要与标签名相同
3、类选择器（class）
（1）class属性是标签属性，任何元素都可以有class属性
/*设置class值一致*/
<div>
<div class = "one">文字内容</div>
<p class = "one">文字内容</p>
<span class = "one">文字内容</span>
</div>
（2）使用class选择器时，要在class值前加上“·”
/*class选择器*/
<style type = "text/css">
·one{
color : red ; font-weight : 600 ;
}
</style>
（3）class选择器可以被多个元素共同使用，不同元素可以有相同的class值
（4）同一个元素可以有多个类名（即class值），要使用空格隔开
/*class选择器*/
<style type = "text/css">
·one{
color : red ; font-weight : 600 ;
}
·two{
font-size : 30px ;
}
</style>
<div>
<div class = "one two">文字内容</div>
</div>
<strong class = "two">文字内容</strong>
（5）css中尽量使用class选择器，而不是id选择器
4、通用选择器
（1）可以选择页面中的所有元素
（2）使用通配符 " * " 进行选择
CSS高级选择器
1、后代选择器
（1）描述的是一种祖先结构关系，不一定是父子关系
（2）祖先和后代之间要用一个空格隔开
2、并集选择器
（1）同时选中多个元素
（2）选择时要用 “，” 隔开
（3）标签选择器，id选择器，class选择器都可以在并集选择器中使用
3、交集选择器
（1）选择的元素要同时满足多个条件
（2）选择器间没有空格（即两个选择器紧挨）
（3）交集选择器不适用id选择器（因为在同一个页面中id只有唯一的）
（4）交集选择器要把标签选择器放在前，类选择器放在后
序列选择器
1、第一/最后子元素选择器
<style type = "taxt/css">
/*第一子元素选择器*/
h3 : first-child{
color : red ;
}
/*上述 选择的是h3元素的父元素中，是h3的第一个子元素（必须满足这两种条件才可选中）*/
/*最后子元素选择器*/
div : last-child{
color : red ;
}
/*上述 选择的是div元素的父元素中，是div的最后一个子元素（必须满足这两种条件才可选中）*/
</style>
<body>
<h3>文字内容</h3>
<p>文字内容</p>
<div>文字内容</div>
</body>
2、nth-child选择器
例：
1945
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
