简述：css3全然向后相容,不须要发生改变已近结构设计。应用程序一般来说全力支持 CSS2。
CSS3被分割成组件，【-moz- , -o- , -webkit-】
有：
1）示例
2）框数学模型
3）大背景：
—>特性：
->：background-size：明确规定RICOH的体积。
->：background-origin： 明确规定RICOH的功能定位地区。
->：background-clip： 明确规定大背景的绘出地区。RICOH能置放于 content-box、padding-box 或 border-box 地区。
4）前面板：
—>特性：
->： border-radius ：增设大部份五个 border-*-radius 特性的缩写特性。
->： box-shadow ：向方框添加一个或多个阴影。
->： border-image ：增设大部份 border-image-* 特性的缩写特性。
5）文本效果：
—>特性：
->：hanging-punctuation：明确规定标点字符是否位于线框之外。
->：punctuation-trim： 明确规定是否对标点字符展开修剪。
->：text-align-last：增设如何对齐最后一行或紧挨着强制换行符之前的行。
->：text-emphasis：向原素的文本应用重点标记以及重点标记的前景色。
->：text-justify：明确规定当 text-align 增设为 “justify” 时所使用的对齐方法。
->：text-outline：明确规定文本的轮廓。
->：text-overflow： 明确规定当文本溢出包含原素时发生的事情。
->：text-shadow： 向文本添加阴影。
->：text-wrap：明确规定文本的换行规则。
->：word-break： 明确规定非中日韩文本的换行规则。
->：word-wrap： 允许对长的不可分割的单词展开分割并换行到下一行。
—>字体：可将使用的字体文件存放到 web 服务器上，它会在须要时被自动下载到用户的计算机上。您“自己的”的字体是在 CSS3 @font-face 规则中定义的。
->使用：新的 @font-face 规则中，您必须首先定义字体的名称（比如 myFirstFont），然后指向该字体文件。
->CSS3字体描述符：
> font-family：name，必需。明确规定字体的名称。
> src：url,必需。定义字体文件的 URL。
>font-stretch：normal,可选。定义如何剪切字体。默认是 “normal”。
>font-style：ormal,可选。定义字体的样式。默认是 “normal”。
>font-weight：bold,可选。定义字体的粗细。默认是 “normal”。
>unicode-range：可选。定义字体全力支持的 UNICODE 字符范围。默认是 “U+0-10FFFF”。
6）2D/3D效果：
—>转换特性：
->：transform：向原素应用 2D 或 3D 转换。
->：transform-origin：允许你发生改变被转换原素的位置。
->：transform-style：明确规定被嵌套原素如何在 3D 空间中显示。
->：perspective：明确规定 3D 原素的透视效果。
->：perspective-origin：明确规定 3D 原素的底部位置。
->：backface-visibility：定义原素在不面对屏幕时是否可见。
—>2D转换方法：
->：translate()：原素从其当前位置移动，根据给定的 left（x 坐标） 和 top（y 坐标）
->：rotate()：原素顺时针旋转给定的角度。允许负值，原素将逆时针旋转。
->：scale()：原素的体积会增加或减少，根据给定的宽度（X 轴）和高度（Y 轴）
->：skew()：原素翻转给定的角度，根据给定的水平线（X 轴）和垂直线（Y 轴）
->：matrix()：把大部份 2D 转换方法组合在一起，须要六个参数，包含数学函数，允许您：旋转、缩放、移动以及倾斜原素。
—>3D转换方法：Chrome 和 Safari 须要前缀 -webkit-。Opera不全力支持
case>: rotateX/Y/Z()：
case>: rotate3d(x,y,z,angle):原素围绕其 X/Y/Z 轴以给定的度数展开旋转。
case>: translateX/Y/Z()：
case>: translate3d(x,y,z)：原素以其 X/Y/Z 轴以给定的值移动。
case>: scaleX/Y/Z():
case>: scale3d(x,y,z)：原素以其 X/Y/Z 轴以给定的值缩放。
case>: matrix3d(n…n)：定义 3D 转换，使用 16 个值的 4×4 矩阵。
case>: perspective(n)：定义 3D 转换原素的透视视图
7）过渡：是原素从一种样式逐渐发生改变为另一种的效果。
* 必须明确规定两项文本：
明确规定您希望把效果添加到哪个 CSS 特性上
明确规定效果的时长
—>特性：
->：transition：缩写特性，用于在一个特性中增设五个过渡特性。
->：transition-property： 明确规定应用过渡的 CSS 特性的名称。
->：transition-duration：定义过渡效果花费的时间。默认是 0。
->：transition-timing-function： 明确规定过渡效果的时间曲线。默认是 “ease”。
->：transition-delay： 明确规定过渡效果何时开始。默认是 0。
8）动画：@keyframes 规则用于创建动画。在 @keyframes 中明确规定某项 CSS 样式，就能创建由当前样式逐渐改为新样式的动画效果。IE9之前的版不全力支持
from表示0%，动画的开始，to表示100%动画的结束，也可全力支持使用%:
—>绑定到示例：明确规定动画的名称、时长
—>animation特性：
->：@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：明确规定对象动画时间之外的状态。
9）多列布局
—>特性：-moz- -webkit- -o-
->：column-count：明确规定原素应该被分隔的列数。
->：column-fill：明确规定如何充填列。
->：column-gap：明确规定列之间的间隔。
->：column-rule：增设大部份 column-rule-* 特性的缩写特性。
->：column-rule-color：明确规定列之间规则的颜色。
->：column-rule-style：明确规定列之间规则的样式。
->：column-rule-width：明确规定列之间规则的宽度。
->：column-span：明确规定原素应该横跨的列数。
->：column-width：明确规定列的宽度。
->：columns：明确规定增设 column-width 和 column-count 的缩写特性。
10）用户界面：包括原素体积、盒体积及轮廓等
—>特性：-moz- -webkit- -o-
->：appearance：允许将原素增设为标准用户界面原素的外观
->：box-sizing：允许以确切的方式定义适应某个地区的具体文本。
->：icon：为创作者提供使用图标化等价物来增设原素样式的能力。
->：nav-down：明确规定在使用 arrow-down 导航键时向何处导航。
->：nav-up：明确规定在使用 arrow-up 导航键时向何处导航。
->：nav-index：增设原素的 tab 键控制次序。
->：nav-left：明确规定在使用 arrow-left 导航键时向何处导航。
->：nav-right： 明确规定在使用 arrow-right 导航键时向何处导航。
->：outline-offset：对轮廓展开偏移，并在超出前面板边缘的位置绘出轮廓。轮廓不占用空间；轮廓可能是非矩形
->：resize：明确规定是否可由用户对原素的体积展开调整。
博客地址：
Web此基础之CSS3
