码迷,mamicode.com
首页 > Web开发 > 详细

css3简易总结

时间:2017-12-20 23:16:17      阅读:349      评论:0      收藏:0      [点我收藏+]

标签:ace   文字阴影   top   orm   旋转   wrap   计算机   resize   rap   

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轮廓(不占空间,可以是非矩形)

css3简易总结

标签:ace   文字阴影   top   orm   旋转   wrap   计算机   resize   rap   

原文地址:http://www.cnblogs.com/jiuyejiu/p/8076241.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!