1 box-sizing
(1)box-sizing: border-box;
所设置的width和height包括padding和border
(2)box-sizing: content-box;
所设置的width和height不包括padding和border,只对content。
2 background-clip
(1)background-clip: border-box;
整个盒模型(content+padding+border)都有背景
(2)background-clip: padding-box;
(content+padding)有背景
(3)background-clip: content-box;
content有背景
3 background-origin
(1)background-origin: border-box;
从盒模型的border的左上角开始显示背景;
(2)background-origin: padding-box;
从盒模型padding的左上角开始显示背景;
(3)background-origin: content-box;
从盒模型content的左上角开始显示背景;
4 background-size: wwpx hhpx;
设置背景的大小
5 旋转
设置旋转的角度:
transform: rotate(90deg);
设置旋转的圆心:
transform-origin: center center
缩放:
scale:
scaleX:
scaleY:
scaleZ:
移位:
transform: translate(50px, -4em);
相关推荐
CSS3教程和css3新特性专题
资源名称:深入了解 CSS3 新特性资源截图: 资源太大,传百度网盘了,链接在附件中,有需要的同学自取。
CSS3新特性和CSS3教程 通俗易懂 简单易学
本资源是基于html5 rocks作的CSS3介绍,是PPT风格的网页,本人做介绍用的,自己写了一些代码进去,大家可以参考。 HTML5 Rocks官网上有更丰富的关于HTML5+CSS3+JS的介绍,由于资源比较大,大家可以自己到官网下载。
1.07 css3新特性
HTML5 Rocks是由谷歌牵头的开源的web项目。有丰富的html5的demo。 基于html5 rocks作的CSS3介绍,是PPT风格的网页,大家可以参考。 HTML5 Rocks官网上有更丰富的关于HTML5+CSS3+JS的介绍,大家可以自己到官网下载。
CSS3新特性1
CSS3新特性,带你一小时学完CSS3
这是一个对IE8及以下做前端兼容的文件工具...--对于ie6到ie8做兼容,兼容h5,css3等新特性--> <!--[if (gte IE 6)&(lte IE 8)]> [removed][removed] [removed][removed] [removed][removed] <![endif]-->
CSS3新特性.md
现如今,随着 Web2.0 技术的流行,之前的 CSS2 标准和相关技术似乎已经满足不了日益增长的开发需求:人们需要实现更加美观、用户体验更好的界面。...这篇文章将主要来介绍 CSS3 的新特性以及一些使用上的技巧。
CSS3特性demo页面 含文字阴影,边框阴影,圆角,选择器,等
喜欢玩css的看看吧。适合css高级选手。
CSS3把很多以前需要使用图片和脚本来实现的效果,只需要短短几行代码就能搞定,接下来通过本文给大家介绍CSS3哪些新特性值得称赞,对css3新特征相关知识感兴趣的朋友一起学习吧
搜索图标 search icon 使用css3的after特性进行search icon。 使用css3的after特性进行search icon css before search-icon
之前我们已经给大家介绍了关于html5的新特性,除了html5的新特性,CSS3的新特性也是面试中经常被问到的。下面话不多说了,需要的朋友们跟随小编来一起看看详细的介绍吧。 选择器 CSS3中新添加了很多选择器,解决了很...
CSS3是CSS(层叠样式表)技术的升级版本,于1999年开始制订,2001年5月23日W3C完成了 CSS3的工作草案,主要包括盒子模型、列表模块、超链接方式、语言模块、背景和边框、文字特效、多 栏布局等模块 [1] 。 CSS演进的...
H5新特性以及结合C3的小demo,有利于更好的学习H5开发