我相信所有的新技术都是为了解决某些现存的痛点，CSS3的出现也不例外。
仅需要几行代码，CSS3可以创造出各种效果：圆角、背景渐变、文字阴影、盒阴影、
自定义字体以及多重背景图片（当然，这个效果确实需要图片）。如果这还不够神奇，
甚至我们之前需要依赖 JavaScript的一些基本交互效果如悬停动画，也可以使用纯 CSS3
来实现。
一、Internet Explorer 6 到 8 对CSS3 的支持
老版本的 IE（IE 6、7、8）几乎不支持 CSS3的新特性
我个人而言，目前我主要将 CSS3用作增强网站，而不是用它提供基本功能。
二、CSS3解析规则
1 .round {
2 border-radius: 10px;
3 }
这条规则由选择器（ .round ）和声明（ border-radius: 10px; ）组成。而声明则由属
性（ border-radius: ）和值（ 10px; ）组成。
三、私有前缀及其用法
1 .round{ 2 -khtml-border-radius: 10px; /* Konqueror */ 3 -rim-border-radius: 10px; /* RIM */ 4 -ms-border-radius: 10px; /* Microsoft */ 5 -o-border-radius: 10px; /* Opera */ 6 -moz-border-radius: 10px; /* Mozilla (如 Firefox) */ 7 -webkit-border-radius: 10px; /* Webkit (如 Safari 和 Chrome) */ 8 border-radius: 10px; /* W3C */ 9 }
样式表中后出现的属性优先级高于之前出现的同名属性。
四、实例：CSS3多栏布局
需求：将一整段文本显示在多个栏位中
在 CSS3出现之前，你必须将内容拆分到不同的标签中，然后分别设定样式。
1 <div id="main"> 2 <p>lloremipsimLoremipsum dolor sit amet, consectetur 3 // 任意文字 // 4 </p> 5 </div>
CSS3：
1 #main { column-width: 12em; }
效果如下：
1024视口：
768视口：
如果你想保持栏位数量不变而让栏位宽度根据视口自动调整：
1 #main { column-count: 4; }
增加栏位间隙和分割线可以让多列布局的效果更好：
1 #main { 2 column-gap: 2em; 3 column-rule: thin dotted #999; 4 column-width: 12em; 5 }
