CSS3新属性CSS即CascadingStyleSheets，中文译为层叠样式表。3表示它的版本，那么3和1、2有什么区别呢？CSS1、CSS2、CSS3的区别CSS1CSS1是指CSS（CascadingStyleSheets）的第一版，于1996年12月17日成为W3C推荐标准，由HarkenWimLay和BurtBoss共同设计。此版本提供了有关类型、颜色、位置和文本属性的基本信息。CSS2CSS2是CSS（CascadingStyleSheets）的第二层，是W3C于1998年推出的一项技术规范，提供了比CSS1更强的XML和HTML文档格式化功能。例如，元素的扩展定位和视觉格式、页面格式和打印支持、声音样式表等。CSS3CSS3是CSS（CascadingStyleSheet）技术的升级版，制定于1999年。2001年5月23日，W3C完成了CSS3的工作草案，主要包括框模型、列表模块、超链接方法、语言模块、背景边框、文字效果、多栏布局等模块。CSS演变的一个主要变化是W3C决定将CSS3拆分为一系列模块。浏览器供应商紧跟CSS的步伐快速创新，因此通过采用模块化方法，CSS3规范中的元素可以以不同的速度发展，因为不同的浏览器供应商仅支持给定的功能。但是不同的浏览器在不同的时间支持不同的特性，这也给跨浏览器开发带来了复杂性。CSS3的新属性CSS3有很多新特性，圆角效果、图形边框、块状阴影和文字阴影，使用RGBA实现透明效果，渐变效果，使用@Font-Face实现自定义字体，多种背景图片、文本或图像变换处理（旋转、缩放、倾斜、移动）、多列布局、媒体查询等边框特性CSS3对网页中的边框做了一些改进，主要包括支持圆角边框、多-图层边框、边框颜色和图片等。CSS3中最常用的改进之一是圆角边框。通过CSS3的属性可以快速实现圆角定义，同时可以根据实际情况为具体的角定义圆角。/*圆形边框*/div{border:2pxsolid;border-radius:25px;}/*imageborder*/div{border-image:url(border.png)3030round;-webkit-border-image:url(border.png)3030round;/*Safari5及更早版本*/-o-border-image:url(border.png)3030round;/*Opera*/}多张背景图片CSS3允许将多个属性（如background-image,background-repeat,background-size,background-position,background-origin,background-clip等）添加多层背景图片到一个元素。该属性的应用大大改善了以往面对多层次设计时的多层布局问题，帮助web前端开发人员在不借助Photoshop的情况下实现页面背景的设计，并简化背景图像的维护成本。/*多图像背景*/#example1{background-image:url(img_flwr.gif),url(paper.gif);背景位置：右下，左上；background-repeat：不重复，重复；}/*or*/#example1{background:url(img_flwr.gif)rightbottomno-repeat,url(paper.gif)lefttoprepeat;}颜色和透明度的引入CSS3颜色模块实现制作网页效果时无限制有RGB和十六进制两种模式。CSS3添加了几种新的颜色模式，例如HSL、HSLA和RGBA。这些颜色模式的提出，不仅可以在开发时设置元素的颜色，还可以方便的根据需要设置元素的透明度。多栏布局和flexbox模型布局CSS3多栏布局属性可以在不使用多个div标签的情况下实现多栏布局。CSS3中的多栏布局模块描述了如何像报纸杂志一样将一个简单的块拆分成多个栏，并通过相应的属性实现栏数、栏宽、栏与栏之间的空白。灵活的盒模型布局方便Web前端开发者根据复杂的前端分辨率进行灵活的布局，轻松实现页面中某个块的水平和垂直方向的对齐。它是响应式网站开发的绝佳工具/*moreColumnlayout*/.newspaper{column-count:3;列间距：40px；列规则样式：开始；列规则颜色：#ff0000；column-rule-width:1px;}h2{column-span:all;}/*flexiblebox*/
