css关系选择器汇总

1、1 1相邻选择符相邻选择符（E+F）bodybackground-color:deepskyblue;P+Pcolor:#f00;这是一个标题这是一个文字段落这是一个文字段落这是一个标题这是一个文字段落这是一个标题这是一个文字段落这是一个文字段落兄弟选择符（EF）bodybackground-color:deepskyblue;PPcolor:#f00;这是一个标题这是一个文字段落这是一个文字段落这是一个标题这是一个文字段落这是一个标题这是一个文字段落这是一个文字段落3子选择器子选择符（EF）FsRules-bodybackground-color:deepskyblue;.testliaco

2、lor:#f00;列表项目1项目列表1.1项目列表1.2列表项目2项目列表2.1项目列表2.2列表项目列表项目4包含选择器包含选择符（EF）bodybackground-color:deepskyblue;ullicolor:#f00;列表项目列表项目列表项目列表项目RelationshipSelectorsindexF）,相邻选择符（E+F）,兄弟选择符（E-F）/bodybackground-color:deepskyblue;CSSRelationshipSelectors关系选择符关系选择符RelationshipSelectorsSelectors选择符Name名称CSSVersio

3、n版本Description简介EF包含选择符(Descendantcombinator)CSS1选择所有被E元素包含的F元素。E>F子选择符(Childcombinator)CSS2选择所有作为E元素的子元素F。E+F相邻选择符(Adjacentsiblingcombinator)CSS2选择紧贴在E元素之后F元素。EF兄弟选择符(Generalsiblingcombinator)CSS3选择E元素所有兄弟元素F。这种颜色的链接表示是CSS31择符或原选择符被CSS3慎改并赋予了新的特性6属性选择器属性选择符Eattbodybackground-color:deepskyblu

4、e;aclasscolor:#f00;属性选择符Eatt=vallililili内部链接内部链接外部链接外部链接/li7属性选择符Eatt=val描述：选择具有att属性且属性值等于val的E元素语法：Eatt=valsRulesbodybackground-color:deepskyblue;)aclass=externalcolor:#f00;)外部链接v/av/li内部链接v/a外部链接v/a内部链接v/a8属性选择符Eatt-=val属性选择符Eatt-=valbodybackground-color:deepskyblue;aclass=external”color:#f00;外部链

5、接内部链接外部链接li内部链接9属性选择符EattA=val属性选择符EattA=val/titlebodybackground-color:deepskyblue;liclassA=acolor:#f00;class=abc列表项目class=acb列表项目class=bac列表项目class=bca列表项目class=cab列表项目class=cba列表项目10属性选择符Eatt$=val属性选择符Eatt$=valbodybackground-color:deepskyblue;)liclass$=a11属性选择符Eatt*=val属性选择符Eatt*=valbodybackground

6、-color:deepskyblue;)liclass*=acolor:#f00;)color)liclassliclassliclassliclassliclassliclass#f00;=abc列表项目=acb列表项目=bac列表项目=bca列表项目=cab列表项目=cba列表项目的字符串的E元素class=abc列表项目class=acb列表项目class=bac列表项目class=bca列表项目class=cab列表项目class=cba列表项目12属性选择符Eatt|=val属性选择符Eatt|=val!-描述：选择具有att属性且属性值为以val开头并用连接符-分隔的字符串的E元素

7、。语法：Eatt|=valsRules-bodybackground-color:deepskyblue;)liclass|=test3color:#f00;)13css属性选择器AttributeSelectorsindexbodybackground-color:deepskyblue;)class=test1-abcclass=test2-abcclass=test3-abcclass=test4-abcclass=test5-abcclass=test6-abc列表项目/li列表项目/li列表项目/li列表项目/li列表项目/li列表项目/liCSSAttributeSelectors

8、属性选择符属性选择符AttributeSelectorsSelectors选择符CSSVersion版本Description简介EattCSS2选择具有att属性的E元素。Eatt="val"CSS2选择具有att属性且属性值等于val的E元素Eatt="val"CSS2选择具有att属性且属性值为一用空格分隔的字词列表，其中一个等于val的E元素。ahref=att4.htm"val"CSS3选择具有att属性且属性值为以val开头的字Eatt$="val"CSS3选择具有att属性且属性值为以val结尾的字符串的E元素。Eatt*="val"CSS3选择具有att属性且属性值为包含val的字符串的E元素。Ea