一、层次选择器
1.后代选择器
①，后代选择器两个符号之间必须用空格隔开，并且空格中间不能插入任何东西。
被ul所包含的所有元素li都是他的后代元素，所以都会变红。ul li
2.子选择器
被ul所包含的所有元素li都是他的子元素，但因为第个li被span包裹，所以他是ul的孙子级别，无法变红。ul>li
3.相邻兄弟选择器
li class=name的相邻下一个兄弟变红用.name+li的形式来选择
4.通用兄弟选择器
①。li class=name之后的所有兄弟都变红用.name~li的形式来选择
②。border：1px solid red；表示像素为1的红色边框
二、属性选择器 ，[]表示属性的意思 里面写具体属性的名称
1.E[attr] 选择匹配具有属性attr的E元素
E[attr] 选择匹配具有属性attr的E元素
li里面含有id的字变红
2.E[attr=val] 选择匹配具有属性attr的E元素,并且属性值为val（其中val区分大小写）
所有li里面包含的class=one的字变红
2.E[attr^=val] 选择匹配元素E，且E元素定义了属性attr，其属性值是以val开头的任意字符串
li里面的class=""里面以a开头的字变红
4.E[attr$=val] 选择匹配元素E，且E元素定义了属性attr，其属性值是以val结尾的任意字符串
li里面class=""里面以b为结尾的字变红
5.E[attr*=val] 选择匹配元素E，且E元素定义了属性attr，其属性值包含了“val”，换句话说，字符串val与属性值中的任意位置相匹配
li里面class=""里面所有带有b的字变红
