作用：用于选则控件，设置样式
常用的样式选择器：
一、基础样式选择器
1、id选择器 用#来选择 ps：id是唯一的不允许重复
#id的名称{
样式：值
} -------给id为指定名称的控件，设置样式
css代码如下：
<style type="text/css">
#box1{
/* 宽度为200px */
width: 200px;
/* 高度为200px */
height: 200px;
/* 背景颜色 */
background-color: aquamarine;
}
</style>
效果如图：
2、类选择器 用.（点）来选择 ps：class是允许重复的 可以同时选择多个
.类的名称{
样式：值
} ------给class为one的控件设置样式
css代码如下：
<style type="text/css">
.one{
/* 200px的宽 */
width: 200px;
/* 200px的高 */
height: 200px;
/* 背景颜色为aqua(蓝色) */
background-color: aqua;
/* 1px 的细实线 红色的 边框 */
border: 1px solid red;
}
</style>
效果如图：
3、标签选择器 标签选择器用标签的名称选择
存在的标签名称{
样式：值
} -------给li标签设置样式
css代码如下：
<style type="text/css">
li{
/* 颜色为红色red */
color: red;
}
</style>
ps：在我写的代码中 下面有li标签 所有我可以使用标签选择器来选择所有的li标签。
效果如图：
二、扩展样式选择器
注意： 这些标签 因为使用不多 有的作用我也不是特别清楚 欢迎指正！
1、全局选择器 它的样式会应用到所有的控件，包括body，只要是页面中的标签都会生效
*{
样式:值
}
2、并集选择器 同时选择多个控件
用法1 选择器1,选择器2,{
样式:值
}
用法2 #**,.***,div{
样式:值
}
3、后代选择器 只要是父元素包含的，就都会被选择
父元素 后代元素{
样式：值
}
例如： div p{
} --------表示对div下的所有p标签有效 注意是所有的P标签
4、父级选择器
父元素>子元素 {
样式：值
}
例如： div>p{
} ---------表示的对所有父元素是div的p标签有效
注意：
父级选择器和后代选择器是不同的 后代选择器 能把标签下的所有标签都选择 父级选择器只能选择父级是这个标签的 如上的代码 span里面的P标签 就不会被选中！
效果如图：
第二段因为是在span里面 所有他的父级标签 就不是div 所以 没有被选中。
5、伪类样式选择器
a:link {color:#FF0000;} /* 未访问的链接 */
a:visited {color:#00FF00;} /* 已访问的链接 */
a:hover {color:#FF00FF;} /* 鼠标划过链接 */
a:active {color:#0000FF;} /* 已选中的链接 */
当鼠标悬停在控件上时，选择控件
标签名:hover{
}
这个选择器的具体效果 要自己尝试 才能更明白 我的口才有限 不能给大家解释清楚！
6、属性选择器
[属性名=值]{
}
这个标签 我不是特别熟 大家可以帮我补充一下 ！！‘
效果如图：
