C3-目录→选择器
2016-12-28 本文已影响88人
Jianshu9527
1 css2.1选择器
- ( * ) 通配符选择器//选取全部元素
- ( div ) 标签选择器//元素自身作为选择器
- (.box) 类选择器//
- (#box) id选择器
- (div p) 后代选择器//元素div下面的有一个span子级元素
- (div.box) 交集选择器
- (div,box)并集选择器
- 四类伪类元素
- a:link
- a:visited
- a:hover//IE6只作用于a标签 IE7后作用于任何元素
- a:active //IE6,7只作用于a,之后作用于任何元素
2 css3选择器
1 按照元素的属性来进行选择
**IE7开始兼容
- Element[att] //选择具有att属性的元素
- Element[att="value"] //选择具有att属性的元素,并且属性值等于value的元素
- Element[att*="value"] //选择具有att属性的元素,并且包含value的元素
- Element[att^="value"] //选择具有att属性的元素,且属性值以value开头的元素
- Element[att$="value"] //选择具有att属性的元素,且属性值以value结尾的元素
- Element[att~="value"] //选择具有att属性的元素,且属性值以value是空格分割的独立元素
2** 按照元素的关系来进行选择**
- div span //div下面的子级元素span
- div>span //div下面的第一个span子级元素
- div+span //div紧靠的span元素
- div~span //div后面所有的元素(IE7才开始兼容)
4 css3伪类选择器
- :root 根标签选择器
- :nth-child() //选择父元素下面的n个孩子
- :first-child() //选择是父母下面的第一孩子的元素(IE7才开始支持)
- :last-child() //选择是父母下面的最后一个元素
- :nth-last-child //选择其父母下面的倒数第N个孩子
- :only-child //选择是独生子女的孩子
- :nth-child(2n) //选择排行为偶数的元素
- :nth-child(2n+1) //选择排行为奇数的元素
- :nth-child(-n+3) //选择排行前三的元素
5 css3伪类元素选择器
- :before //表示在盒子内部的最前面插入一个新元素
- :after //表示在元素内部的最后面插入一个新元素(IE8开始支持)