CSS3 过度效果、动画、多列

一、CSS3过度：

       CSS3过渡是元素从一种样式逐渐改变为另一种的效果。要实现这一点，必须规定两相内容：指定要添加效果的CSS属性；指定效果的持续时间。如果为指定持续时间，transition将没有任何效果。

所有的过渡属性：

二、CSS3动画：

CSS3可以创建动画。@keyframes规则是创建动画。@keyframes规则内指定一个CSS样式和动画将逐步从目前的样式更改为新的样式。当在 @keyframes 创建动画，把它绑定到一个选择器，否则动画不会有任何效果。指定至少这两个CSS3的动画属性绑定向一个选择器：规定动画的名称；规定动画的时长。如果省略持续时间，动画将无法运行，因为默认值是0。

改变背景色和位置：

CSS3的动画属性：

三、CSS3多列：

CSS3可以将文本内容设计成像报纸一样的多列布局。CSS3的多列属性：column-count、column-gap、column-rule-style；column-rule-width、column-rule-color、column-rule、column-span、column-width。

1、column-count：

column-count属性指定需要分隔的列数。

1. 、column-gap：

column-gap属性指定列与列之间的间隙。

2、column-rule-style：

column-rule-style属性指定列与列之间的边框样式.

3、column-rule-width：

column-rule-width属性指定了两列的边框厚度：

4、column-rule-color：

column-rule-color属性指定两列的边框颜色。

5、column-rule：

column-rule属性是column-rule-*所有属性的简写：

6、column-span：

column-span属性指定元素跨越多少列。

7、column-width：

column-width属性指定列的宽度：

CSS3多列属性：