1.CSS3新增加的选择器:
参考tomorrownan的博客:css3新增选择器。
2.动态伪类选择器
锚点伪类::link
,:visited
用户行为伪类::hover
,active
,:focus
3.属性选择器
选择器 | 功能描述 |
---|---|
E[attribute] | 选取带有指定属性的元素 |
E[attribute=value] | 选取带有指定属性和值的元素 |
E[attr^=“val”] | 匹配属性attr的值以指定值”val”开头的每个元素 |
E[attr$=“val”] | 匹配属性attr的值以指定值”val”结尾的元素 |
E[attr*=“val”] | 匹配属性attr的值包含字符串”val”元素 |
3.UI元素状态伪类
:enabled
,:disabled
,:checked
.
4.结构伪类选择器
Elemnet:nth-child(n)
等,其中n必须从1开始,odd表示奇数,even表示偶数。
选择 | 功能描述 |
---|---|
:root | 选择匹配文档的根元素 |
E:nth-child(n) | 选择所有在其父元素中的第n个位置的匹配E的子元素 |
E:nth-last-child(n) | 选择所有在其父元素中倒数第n个位置的匹配E的子元素 |
E:nth-of-type(n) | 选择所有在其父元素中同类型第n个位置的匹配E的子元素 |
E:nth-last-of-type(n) | 选择所有在其父元素中同类型倒数第n个位置的匹配E的子元素 |
E:last-child | 选择位于其父元素中最后一个位置,且匹配E的子元素 ,与E:nth-last-child(1)等同 |
E:fisrt-child | 选择位于其父元素中第一个位置,且匹配E的子元素 ,与E:nth-child(1)等同 |
E:first-of-type | 选择在其父元素中匹配E的第一个同类型子元素 |
E:last-of-type | 选择在其父元素中匹配E的最后一个同类型子元素 |
E:only-child | 选择在其父元素中只包含一个子元素,且该子元素匹配E。 |
E:only-of-type | 选择在其父元素中只包含一个同类型子元素,且该子元素匹配E。 |
E:empty | 选择匹配E的元素,且该元素不包含子元素。 |
5.否定选择器
:not(Element/selector)
,选择器匹配非指定元素/选择器的每个元素。
6 伪元素
::frist-line
对Element元素中的第一行文本进行格式化,只能作用于块级元素。
::frist-letter
对Element元素中的第一个字符进行格式化,只能作用于块级元素。
::before
在元素的内容前面插入新的内容。
::after
在元素的内容后面插入新的内容。