1.自定义动画关键帧
@keyframes自定义动画名称{
0%{}
100%{}
}
animation-name:自定义动画名称
animation-duration 动画持续时间
animation-time-function 动画速度
1.ease 2.ease 3.ease-in 4.ease-out 5.ease-in-out 6.cubic-bezier(x1,y1,x2,y2) 7.steps()
animation-delay 动画延迟时间
animation-iteration-count 动画播放次数
默认1 数字
infinite 无限次
qnimation-direction 动画方向
1.normal 默认 从开始到结束
2.reverse 反向 从结束到开始
3.alternate 正向来回播放 从开始到结束 再到开始
4. alternate-reverse 反向来回播放 从结束到开始到开始再到结束
媒体查询
1. @media screen and (max-width: 600px){ .list{ width: 100%; height: 100px; } }
2.meta元数据标签
<meta name="viewport" content="width=device-width, initial-scale=1.0" ,maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" /> >
3. em与rem的区别:
em 一个文字的倍数 继承父级元素的字体大小 rem 一个文字的倍数 继承根目录的字体大小.
rem经常用在手机端.