css3非常强大,新增了好多功能
一、新选择器
- 属性选择器 [title]、[class="demo"]
- 结构伪类选择器:nth-child(n) nth-of-type()
- 伪元素选择器 ::before ::after
二、转换transform
- 2D
- translate(x,y)
- Scale(x,y)
- rotate(60deg)
- 3D
- rotateX(x) rotateY(y)、 rotateZ(z)
- 3D呈现:transform-style:preserve-3d;定义子元素是否保留3D呈现
三、动画animation
- 先定义 @keyframes
- 后调用 animation
- 重点记住简写属性
- 动画状态不能简写:例animation-play-state: paused
四、浏览器私有前缀
目的:为了兼容浏览器老版本的写法
- -webkit- safari、chrome私有前缀
- -ms- ie私有前缀
- -moz- 火狐私有前缀
- -o- Opera 私有前缀
例:-webkit-border-radius:10px;