CSS入门笔记六：复合选择器

复合选择器是由两个或多个基础选择器组合在一起的选择器，常用的复合选择器有：后代选择器、子选择器、并集选择器、伪类选择器。

1.后代选择器：又称包含选择器，可以选择父元素内的子元素
语法：

父标签名 子标签名 {
			属性1： 属性值；
			.....
			}

2.子选择器:只能选择某元素最近一级的子元素。
语法：

元素1 > 元素2 {
			样式申明
			}

注意：子选择器只会选择父元素的直接子类而不选择间接子类。如：

  ol>a {
            color: red;
        }
        
         <ol>
        <a href="#">儿子1</a>
        <a href="#">儿子2</a>
        <li>
            <a href="#">孙子</a>
        </li>
    </ol>

这里只有儿子1、儿子2变成红色，而孙子不会变色。

3.并集选择器：将一类标签改成相同的样式。任何元素的可以加入并集选择器。
语法：

             元素1，
             元素2，
             ...
             元素n {
             样式申明
             }

4.伪类选择器：用于向某些选择器添加效果，比如点击链接时链接文字的颜色改变

常见伪类选择器
a.链接伪类选择器

				a:link{
					样式申明
					}
			  //当链接还未被访问时会显示link内定义的样式	
			  	
				a:visited {
					样式申明
					}
	          //当链接被访问后会变成visited内定义的样式
			
			a:hover{
					样式申明
					}
			 //当鼠标放在链接上时会显示hover内定义的样式

			a:active{
					样式申明
					}
			//当鼠标点击并且未松开时会显示active内定义的样式				
			
	          
		

注意：若开发时四个链接选择器都需要用，请按照LVHA的顺序来写

b.focus伪类选择器：用于选取获得光标的表单元素
语法：

      input:focus {
      		样式申明
      		}
      //当光标点击到相应的input框的时候，input框会显示focus内定义的样式，
        当光标离开后恢复原状