CSS3 新功能

CSS3 新功能

1 CSS3 边框
用CSS3，你可以创建圆角边框，添加阴影框，并作为边界的形象而不使用设计程序，如Photoshop。


2 CSS3 圆角
使用 CSS3 border-radius 属性，你可以给任何元素制作 "圆角"。


3 CSS3 背景
CSS3中包含几个新的背景属性，提供更大背景元素控制。
background-size
background-origin
多重背景图像


4 CSS3 渐变（Gradients）
CSS3 渐变（gradients）可以让你在两个或多个指定的颜色之间显示平稳的过渡。
以前，你必须使用图像来实现这些效果。但是，通过使用 CSS3 渐变（gradients），你可以减少下载的事件和宽带的使用。此外，渐变效果的元素在


放大时看起来效果更好，因为渐变（gradient）是由浏览器生成的。
CSS3 定义了两种类型的渐变（gradients）：
线性渐变（Linear Gradients）- 向下/向上/向左/向右/对角方向
径向渐变（Radial Gradients）- 由它们的中心定义


5 CSS3 文本效果
text-shadow
word-wrap


6 CSS3 字体
CSS3 @font-face 规则
以前CSS3的版本，网页设计师不得不使用用户计算机上已经安装的字体。
使用CSS3，网页设计师可以使用他/她喜欢的任何字体。
当你发现您要使用的字体文件时，只需简单的将字体文件包含在网站中，它会自动下载给需要的用户。
您所选择的字体在新的CSS3版本有关于@font-face规则描述。
您"自己的"的字体是在 CSS3 @font-face 规则中定义的。


7 CSS3 2D 转换
CSS3 转换
CSS3转换，我们可以移动，比例化，反过来，旋转，和拉伸元素。


8 CSS3 3D 转换
3D Transforms
CSS3 允许您使用 3D 转换来对元素进行格式化。
一些 3D 转换方法：
rotateX()
rotateY()


9 CSS3 过渡
CSS3中，我们为了添加某种效果可以从一种样式转变到另一个的时候，无需使用Flash动画或JavaScript。


10 CSS3 动画
CSS3，我们可以创建动画，它可以取代许多网页动画图像，Flash动画，和JAVAScripts。
CSS3 @keyframes 规则
@keyframes规则是创建动画。 @keyframes规则内指定一个CSS样式和动画将逐步从目前的样式更改为新的样式。


11 CSS3 多列
通过 CSS3，您能够创建多个列来对文本进行布局 - 就像报纸那样。
多列属性：
column-count
column-gap
column-rule


12 CSS3 用户界面
在 CSS3 中, 增加了一些新的用户界面特性来调整元素尺寸，框尺寸和外边框。
用户界面属性：
resize
box-sizing
outline-offset