CSS的高级选择器

1.层次选择器

层次选择器 ：后代选择器，子选择器，相邻兄弟选择器，通用选择器

1.1后代选择器

后代选择器两个选择符之间必须要以空格隔开，中间不能有任何其他的符号插入

空格可以多 但是不可以插入其他的符号以免造成干扰

1.2 子选择器

> 左右可以添加空格

E>F 选择匹配的F元素，且匹配的F元素是匹配的E元素的子元素

1.3 相邻兄弟选择器

 E+F 相邻兄弟选择器 选择匹配的F元素，且匹配的F元素紧位于匹配的E元素后面

所谓相邻兄弟选择器，就是把当前元素的下一个元素找出来

 1.4 通用选择器

相邻兄弟选择器，就是把当前元素的下一个元素找出来

 E~F 通用兄弟选择器 选择匹配的F元素，且位于匹配的E元素后的所有匹配的F元素

 2 属性选择器

2.1 E[attr]属性选择器

E[attr]  选择匹配具有属性attr的E元素

[ ]表示属性的意思 里面写具体属性的名称比如 [id] 

 2.2E[attr=val]属性选择器

 E[attr=val]  选择匹配具有属性attr的E元素,并且属性值为val（其中val区分大小写）

 

E[attr=val]属性选择器中，属性和属性值必须完全匹配才能被选中

 2.3 E[attr*=val]属性选择器

选择匹配元素E，且E元素定义了属性attr，其属性值包含了“val”，换句话说，字符串val与属性值中的任意位置相匹配

 2.4 E[attr^=val]属性选择器

选择匹配元素E，且E元素定义了属性attr，其属性值是以val开头的任意字符串

在遇到匹配的字符 有特殊符号 比如 :号 // 可以使用引号（单引号和双引号）包裹一下

 2.5 E[attr$=val]属性选择器

$ ：shift+上面键盘的4

选择匹配元素E，且E元素定义了属性attr，其属性值是以val结尾的任意字符串