CSS选择器
选择器：{
样式；
}
h1 {
color : red;
font-weight : normal;
};
1.语法：
.类选择器名称{
css样式代码；
}
注意：
1.英文圆点开头
2.类选择器名称可以任意起名（但不要中文名）
2.使用方法
第一步使用合适的标签把要修饰的内容标记起来
<span></span>
第二步使用class = "类选择器名称"为标签设置一个类
<span class="lxn">我是例子</span>
第三部设置类选择器css样式
<style type ="text/css">
.lz {
color: red;
}
</style>
id选择器类似类选择器，但也有区别：
1.为标签设置 id="名称"，而不是 class="类名称"
2.id选择符前面是（#）号，而不是英文圆点（.）
例子：
<span id="lxn">我是例选择器</span>
<style type ="text/css">
#lxn {
color: red;
}
</style>
类选择器与id选择器比较
相同点：可以应用于任何元素
不同点：
1. id选择器只能在文档中使用一次。与类选择器不同，与类选择器不同，在一个HTML文档中，id选择器只能使用一次，而且仅一次。而类选择器可以使用多次。
例子：
当父母责备我们的时候，<span class="lxn">忘记他们的方式</span>，<span class="lxn">铭记他们的目的</span>。当有人夸你的时候，忘记他们对你的称赞，<span class="lxn">铭记他们对你的鼓励</span>。当失败的时候，忘记失败的痛楚，<span class="lxn">铭记失败的原因</span>。当成功的时候，忘记成功的荣耀，<span class="lxn">铭记成功的艰辛</span>....
注意
1>.以上代码为正确方式
2>.如果把上面 class = "lxn"全部换成 id = "lxn"则为错误
2. 可以使用类选择器词列表方法为一个元素同时设置多个样式。我们可以为一个元素同时设多个样式，但只可用类选择器的方式实现，ID选择器是不可以的（不能使用ID词列表）
例子：
<span class= "lxn lz">其实，事物往往就像一个带核的水果，采下来不能全部吃掉，我们要用“忘却”的刀除去里面的果核，再用“铭记”的容器盛装它们</pan>。
<span id= "a b">如果我们一味“忘记”，最后我们将一无所获。如果我们一味“铭记”，最后我们的心灵就会长满杂草</span>。
<style type ="text/css">
.lxn{
color:red;
}
.lz{
font-size:25px;
}
#a{
color:red;
}
#b{
font-size:25px;
}
</style>
注意： 以上例子 类选择器正确， id选择器错误
子选择器
概念：
还有一个比较有用的选择器子选择器，即大于符号(>)用于选择指定标签元素的第一代子元素。
例子：
<p class="first">三年级时，<span>我还是一个<span>胆小如鼠</span>的小女孩</span>，上课从来不敢回答老师提出的问题，生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
.first>span{border:1px solid red;}
包含（后代）选择器
概念： 包含选择器，即加入空格，用于选择指定标签元素下的后辈元素
格式：.first span{color:red;}
请注意这个选择器与子选择器的区别，子选择器（child selector）仅是指它的直接后代，或者你可以理解为作用于子元素的第一代后代。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择，而子选择器是通过“>”进行选择。
总结 >作用于元素的第一代后代，空格作用于元素的所有后代
通用选择器
概念： 通用选择器是功能最强大的选择器，它使用一个（*）号指定，它的作用是匹配HTML中所有标签元素，如下使用下面代码会使html中任意标签元素字体颜色变为红色
*{
color:red;
}
伪类选择符
伪类选择符，允许给html不存在的标签（标签某种状态）设置样式，比如给html中一个标签元素的鼠标滑过状态来设置字体颜色：
a:hover{color:red}
关于伪类选择符，到目前为止，可以兼容所有的浏览器的"伪类选择符"就是a标签上使用 :hover,其实 :hover 可以放在任意的标签上，比如说 p:hover，但是它们的兼容性也是很不好的，所以现在比较常用的还是 a:hover 的组合。
分组选择符
当你想为html中多个标签元素设置同一个样式时，可以使用分组选择符（，），如下代码为右侧代码编辑器中的h1、span标签同时设置字体颜色为红色：
h1,span{color:red;}
它相当于下面两行代码：
h1{color:red;}
span{color:red;}
