css3
1:属性选择器
2:结构伪类选择器
3:伪元素选择器
4:2d转换
5:动画
6:3d转换
7:浏览器私有前缀
css3是在css2基础上新增的样式
移动端支持优于pc端
不断改进中
应用相对广泛
1:属性选择器:(权重是10)
e[attr]:具有attr属性的
e[attr="val"]:具有attr属性的且属性值是val的
e[attr^="val"]:具有attr属性的且属性值以val开头
e[attr$="val"]:具有attr属性,且以val结尾
e[attr*="val"]:具有attr属性,且含有val
2:结构伪类选择器:(属于伪类选择器,权重是10)
e :first-child:第一个子元素
div :first-child{}
e :last-child:最后一个子元素
e :nth-child(n):第n个子元素(选择父元素中的第几个元素,不管里面的元素是否是同一种类型)
其中n可以是其他意思:
1:n可以是关键词:even:偶数,old:奇数
2:n是数字就是指第几个
3:如果n是公式,则n是从0开始计算nth-child(2n/2n+1/5n/n+5/-n+5)前5个
4:第0个元素或者超出元素,则会被忽略
e :first-of-type:指定类型中的第一个
div span:first-of-type{}
e :lash-of-type:指定类型的最后一个
e :nth-of-type(n):指定类型的第n个
3:伪元素选择器:(权重是1)很重要
::before:在元素内容的前面插入元素
::after:在元素内容的后面插入元素
div::before{
content:"我"
}
注意:
1:before和after中必须有content属性
2:before在div内容前面插入内容,after在内容后面插入内容
3:before和after会创建元素,属于行内元素
4:因为在dom里看不见该元素,所有成为伪元素