css3简易总结

1.border-radius添加边框的圆角；

2.box-shadow添加方框阴影；

3.border-image使用图片创建围绕div元素的边框；

4.background-size规定背景图片的尺寸；

5.background-origin（content-box padding-box border-box）规定背景图片的定位区域；

6.多重背景图片background-image:url(bg_flower.gif),url(bg_flower_2.gif);

7.text-shadow添加文字阴影；

8.word-wrap属性可以强制文本换行（单词过长时）；

9.@font-face可以使用自己的字体，需要时自动下载到用户的计算机；

10.2D转换：（各种transform方法）

a.translate()：元素从其当前位置移动给定的left(x)和top(y)；

b.rotate():若为正，则顺时针旋转给定的角度；

c.scale()：元素尺寸增加或减少，根据给定的宽(x)和高(y);

d.skew():元素翻转给定的角度，根据给定的水平线(x)和垂直线(y);

e.matrix()：将2d转换方法组合在一起；

11.3D转换：

rotateX() rotateY()等；

12.transition(过渡） （属性，时长）；

13.css动画：使用@keyframes创建动画再绑定到某个选择器上；

14.css3多列：（count gap rule）;

15.css3用户界面：resize:both 可由用户调整大小；box-sizing outline-offset轮廓（不占空间，可以是非矩形）

16.root根元素   not  empty target选择器（跳转到target元素后起作用（锚点））

17.box-sizing：计算盒子模型的方法：border-box      content-box(默认，设置的宽度只包括内容部分）

18 moz:firefox    -webkit  chrome safari        -ms  ie     -o   opera

19.transform  rotate 旋转   scale 缩放   skew 扭曲  translate 移动   origin(按哪个点开始变化）

20.盒模型；display:box   column-count