CSS复合选择器

CSS复合选择器

定义：复合选择器是由两个或多个基础选择器，通过不同的方式组合而成的,目的是为了可以选择更准确更精细的选中目标元素标签。

分类：复合选择器共可分为5类，分别为交集选择器，并集选择器，后代选择器，子元素选择器和伪类选择器。

1.交集选择器
交集选择器由两个选择器组成。其中第一个选择器为标签选择器，第二个选择器为类名选择器。两个选择器之间用点隔开。
交集选择器 是 并且的意思。

div.p{ color:blue; }

2.并集选择器
并集选择器是各个选择器之间以逗号隔开，任何形式的选择器都可以作为并集选择器的一部分。如果某些选择器定义的样式相同即可用并集选择器来处理。
并集选择器有和的意思，也就是说，只要逗号隔开的，所有选择器都会执行后面的样式。

div,p,span{ color: red; }

3.后代选择器

后代选择器又称为包含选择器，用来选择元素或元素组的后代，其写法就是把外层标签写在前面，内层标签写在后面，中间用空格分隔。当标签发生嵌套时，内层标签就成为外层标签的后代。

子孙后代都可以这么选择。 或者说，它能选择任何包含在内 的标签。
如div p。示例代码如下：

div p{ color: pink; }

4.子元素选择器
子元素选择器只能选择作为某元素子元素的元素。其写法就是把父级标签写在前面，子级标签写在后面，中间跟一个 > 进行连接，注意，符号左右两侧各保留一个空格。
白话： 这里的子 指的是 亲儿子 不包含孙子 重孙子之类。

ul>li>a{ color: green; }

5.伪类选择器
伪类选择器用于向某些选择器添加特殊的效果。比如给链接添加特殊效果， 比如可以选择 第1个，第n个元素。
伪娘
类 .one
伪类 :link
链接伪类选择器

link /* 未访问的链接 */
visited /* 已访问的链接 */
hover /* 鼠标移动到链接上 */
active /* 选定的链接 */
/*未访问过的链接状态*/
a:link {
	color:red;
	font-size: 25px;
	text-decoration: none;
}
/*鼠标经过链接时候的样子*/
a:hover{
	color: green;
}
/*鼠标按下时候的样子*/
a：active{
	color: yellow;
}
/*访问过的样子*/
a:visited{
	color: black;
}