CSS3的相关内容（二）
Flexbox有4个关键特性：方向丶对齐丶次序和弹性（或者叫“伸缩性” flexiness）
弹性，三个属性（伸展、收缩、基准）合体的简写属性 → flex,
弹性，传给flex的第一个值 → flex-grow,
弹性，传给flex的最后一个值 → flex-basis,
弹性，在空间不够的情况下，当前伸缩项相对于其他伸缩项可以收缩的量。 → flex-shrink,
弹性项 或 伸缩项 → flex-item
次序 → order,
方向 → flex-direction,
对齐（在交叉轴cross axis上） → align-items,
对齐（在主轴main axis上） → justify-content,
弹性项 或 伸缩项 → flex-item
CSS3提供了很多新的选择符，有
- 属性选择符
- 字符串匹配属性选择符（根据属性的部分内容）
- 结构化伪类（基于元素之间的位置关系）
属性选择符，包含…… → *=, 属性选择符，以……结尾 → $=, 属性选择符，以……开头 → ^=, 属性选择符，以使用“空格分隔的” → ~=, 表示“取反” → :not, 选择没有内容（包含注释而不包含空格的元素，也是空的） → :empty, 选择匹配列表中第一项 → :first-child 选择匹配列表中最后一项 → :last-child, 选择匹配列表中奇数个 → :nth-child(odd), 选择的第一行文本目标根据视口大小不同而不同， → :first-line, CSS3 属性选择符一例 → img[alt="sausages"], 从第三项开始，每两项选择一项 → :nth-child(2n+3),
CSS3高级技术特性和属性语法：
背景大小关键词：保持图片比例，拓展图片让其最长边保持在元素内部。 → contain, 用来分隔阴影特性的符号，使其会按照从底部到顶部（从最后一个到第一个）的顺序被添加 → 逗号, 盒阴影容许你在元素的内部或者外部创建盒状的阴影效果 → box-shadow, 背景大小关键词：让图片保持其原生大小 → auto, 背景线性渐变 → linear-gradient, CSS滤镜 → filter, 背景径向渐变 → radial-gradient, 用来叠加不同阴影特性的符号 → 空白, 文字阴影特效，是最被广泛支持的CSS3特性之一。 → text-shadow, 阴影尺寸 或 阴影偏移（可选可省略），文字阴影特效缩写值的第4个值 → spread, 背景大小关键词：保持图片比例，拓展至覆盖整个元素。 → cover, 模糊距离（可选可省略），文字阴影特效缩写值的第3个值 → blur, 重复渐变背景（径向） → repeating-radial-gradient, 盒阴影添加了关键字以產生内阴影（可选） → inset
CSS3 动画属性
下面的表格列出了 @keyframes 规则和所有动画属性： 属性 描述 @keyframes 规定动画。 animation 所有动画属性的简写属性，除了 animation-play-state 属性。 animation-name 规定 @keyframes 动画的名称。 animation-duration 规定动画完成一个周期所花费的秒或毫秒。默认是 0。 animation-timing-function 规定动画的速度曲线。默认是 “ease”。 animation-delay 规定动画何时开始。默认是 0。 animation-iteration-count 规定动画被播放的次数。默认是 1。 animation-direction 规定动画是否在下一周期逆向地播放。默认是 “normal”。 animation-play-state 规定动画是否正在运行或暂停。默认是 “running”。 animation-fill-mode 规定对象动画时间之外的状态。