乱入几个：
1.h5的一个语义化标签
figure :用于规定独立的流内容（图像 图表 照片 代码等）
figcapition：与figure配套使用，用于标签定义figure元素标题
2.媒体查询：
通过不同的媒体类型和条件定义样式规则 ；媒体查询大部分媒体特性都接受min和max 用于表示“大于等于”或“小于等于”： min-width;max-width
媒体查询能够用在@media和import规则上，也能够用在HTML和XML中。
@media screen and (800px){...}
@import url(example.css) screen and (800px);
<link media="screen and (800px)" rel="stylesheet" href="example.css">
css3:
长处：方便。无需js，适合做图片、文字的简单效果；
缺点：不灵活；效果有限
划重点：
-
transform:变形。【transform：translate / rotete / scale / skew(平移 旋转，缩放。斜切)】
-
transition: 过渡。【transition： property, duration, timing-function（Linear,ease,ease-in,ease-out,ease-in-out）, delay】
- 必须要设置两个属性： 设置过渡效果的 CSS 属性的名称; 完毕过渡效果须要多少秒或毫秒。
3、animation:动画。【animation：name/ duration/ timing-function/ iteration-count(播放次数)/ direction/ play-stete】
详细介绍：
Transform :用于元素的变形处理 属性: translate,Rotate,scale,skew (平移 ,旋转，缩放，斜切)
transition： 用于设置四个过渡属性 属性：property,duration,timing-function,delay
transition-property 规定设置过渡效果的 CSS 属性的名称。
transition-duration
规定完毕过渡效果须要多少秒或毫秒。
transition-timing-function
规定速度效果的速度曲线。 （Linear,ease,ease-in,ease-out,ease-in-out）
transition-delay
定义过渡效果何时開始。
animation:全部动画属性的简写属性，除了 animation-play-state 属性。
animation-name
规定须要绑定到选择器的 keyframe 名称。。
animation-duration
规定完毕动画所花费的时间。以秒或毫秒计。
animation-timing-function
规定动画的速度曲线。
animation-delay
规定在动画開始之前的延迟。
animation-iteration-count
规定动画应该播放的次数。
animation-direction
规定是否应该轮流反向播放动画。
举例（chrome浏览器下）：
-
-webkit-animation: myfirst 2s linear 1s infinite both;
-webkit-animation-name: myfirst; -webkit-animation-duration: 5s; -webkit-animation-timing-function: linear; -webkit-animation-delay: 2s; -webkit-animation-iteration-count: infinite; -webkit-animation-direction: alternate; -webkit-animation-play-state: running;
-
@-wbkit-keyframes myfirst {
}
-经常使用參考手冊-
| 属性 | 描写叙述 | CSS |
|---|---|---|
| @keyframes | 规定动画。 | 3 |
| animation | 全部动画属性的简写属性，除了 animation-play-state 属性。 | 3 |
| animation-name | 规定 @keyframes 动画的名称。 | 3 |
| animation-duration |
规定动画完毕一个周期所花费的秒或毫秒。 默认是 0。 |
3 |
| animation-timing-function |
规定动画的速度曲线。 默认是 "ease"。 |
3 |
| animation-delay | 规定动画何时開始。默认是 0。 | 3 |
| animation-iteration-count | 规定动画被播放的次数。默认是 1。 | 3 |
| animation-direction | 规定动画是否在下一周期逆向地播放。默认是 "normal"。 | 3 |
| animation-play-state | 规定动画是否正在执行或暂停。默认是 "running"。 | 3 |
| animation-fill-mode | 规定对象动画时间之外的状态。 | 3 |
animation-timing-function：<single-animation-timing-function>[,<single-animation-timing-function>]*
<single-animation-timing-function> = ease | linear | ease-in | ease-out | ease-in-out | step-start | step-end | steps(<integer>[, [ start | end ] ]?
) | cubic-bezier(<number>,<number>, <number>, <number>)
默认值：ease
适用于：全部元素。包括伪对象:after和:before
继承性：无
动画性：否
计算值：指定值
媒体：视觉
取值：
animation-fill-mode：none | forwards | backwards | both [ , none | forwards | backwards | both ]*
默认值：none
适用于：全部元素，包括伪对象:after和:before
继承性：无
取值：
说明：
检索或设置对象动画时间之外的状态
-
假设提供多个属性值。以逗号进行分隔。
-
相应的脚本特性为animationFillMode。
animation-direction：normal | alternate [ , normal | alternate ]*
默认值：normal
适用于：全部元素，包括伪对象:after和:before
继承性：无
取值：
说明：
检索或设置对象动画在循环中是否反向运动
-
假设提供多个属性值，以逗号进行分隔。
-
相应的脚本特性为animationDirection。