1.CSS3多列
通过CSS3，能够创建多个列来对文本进行布局 - 就像报纸那样.
Internet Explorer 10和Opera支持多列属性。Firefox需要前缀-moz-。Chrome和Safari需要前缀-webkit-。Internet Explorer9以及更早的版本不支持多列属性。
（1）CSS3创建多列
column-count属性规定元素应该被分隔的列数，例如：把div元素中的文本分隔为三列：
div
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari 和 Chrome */
column-count:3;
}
（2）CSS3规定列之间的间隔
column-gap属性规定列之间的间隔，例如：规定列之间40像素的间隔：
div
{
-moz-column-gap:40px; /* Firefox */
-webkit-column-gap:40px; /* Safari 和 Chrome */
column-gap:40px;
}
（3）CSS3列规则
column-rule属性设置列之间的宽度、样式和颜色规则。例如：规定列之间的宽度、样式和颜色规则
div
{
-moz-column-rule:3px outset #ff0000; /* Firefox */
-webkit-column-rule:3px outset #ff0000; /* Safari and Chrome */
column-rule:3px outset #ff0000;
}
（4）新的多列属性
属性 描述 CSS
column-count 规定元素应该被分隔的列数。 3
column-fill 规定如何填充列。 3
column-gap 规定列之间的间隔。 3
column-rule 设置所有column-rule-* 属性的简写属性。 3
column-rule-color 规定列之间规则的颜色。 3
column-rule-style 规定列之间规则的样式。 3
column-rule-width 规定列之间规则的宽度。 3
column-span 规定元素应该横跨的列数。 3
column-width 规定列的宽度。 3
columns 规定设置column-width和column-count的简写属性。 3
2.CSS3用户界面
在CSS3中，新的用户界面特性包括重设元素尺寸、盒尺寸以及轮廓等。
Firefox、Chrome以Safari支持resize属性。
Internet Explorer、Chrome、Safari以及Opera支持box-sizing属性。Firefox 需要前缀-moz-。
所有主流浏览器都支持outline-offset属性，除了Internet Explorer。
（1）CSS3 Resizing
在CSS3，resize属性规定是否可由用户调整元素尺寸。
这个div元素可由用户调整尺寸（在 Firefox 4+、Chrome 以及 Safari 中）。规定div元素可由用户调整大小：
div
{
resize:both;
overflow:auto;
}
（2）CSS3 Box Sizing
box-sizing属性允许以确切的方式定义适应某个区域的具体内容。例如：规定两个并排的带边框方框：
<!DOCTYPE html>
<html>
<head>
<style>
*{ margin:0; padding:0;}
div.container
{
width:30em;
border:1em solid yellow;
}
div.box
{
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
width:50%;
border:1em solid red;
float:left;
}
</style>
</head>
<body>
<div class="container">
<div class="box">这个 div 占据左半部分。</div>
<div class="box">这个 div 占据右半部分。</div>
</div>
</body>
</html>
（3）CSS3 Outline Offset
outline-offset属性对轮廓进行偏移，并在超出边框边缘的位置绘制轮廓。
轮廓与边框有两点不同：轮廓不占用空间；轮廓可能是非矩形。例如：这个div在边框之外15像素处有一个轮廓。
<!DOCTYPE html>
<html>
<head>
<style>
div
{
margin:20px;
width:150px;
padding:10px;
height:70px;
border:2px solid black;
outline:1px solid red;
outline-offset:25px;
}
</style>
</head>
<body>
<p><b>注释：</b>Internet Explorer 和 Opera 不支持 support outline-offset 属性。</p>
<div>这个 div 在边框边缘之外 15 像素处有一个轮廓。</div>
</body>
</html>
（4）新的用户界面属性
属性 描述 CSS
appearance 允许您将元素设置为标准用户界面元素的外观 3
box-sizing 允许您以确切的方式定义适应某个区域的具体内容。 3
icon 为创作者提供使用图标化等价物来设置元素样式的能力。 3
nav-down 规定在使用arrow-down 航键时向何处导航。 3
nav-index 设置元素的tab键控制次序。 3
nav-left 规定在使用arrow-left导航键时向何处导航。 3
nav-right 规定在使用arrow-right导航键时向何处导航。 3
nav-up 规定在使用arrow-up导航键时向何处导航。 3
outline-offset 对轮廓进行偏移，并在超出边框边缘的位置绘制轮廓。 3
resize 规定是否可由用户对元素的尺寸进行调整。 3