CSS3在现在看来似乎还是遥遥无期，我也一直想找份比较全面的CSS3中文资料，无赖偌大个互联网，竟然没找到一篇全面点的，大多只是只言片语。那就自己来吧，今天让我们一睹CSS3的芳容！
多色边框 colored border
多色边框的创建，目前Firefox支持。颜色显示顺序按定义顺序从内到外。
-moz-border-top-colors:#F80 #F90 #FA0 #FB0 #FC0;
-moz-border-right-colors:#F80 #F90 #FA0 #FB0 #FC0;
-moz-border-bottom-colors:#F80 #F90 #FA0 #FB0 #FC0;
-moz-border-left-colors:#F80 #F90 #FA0 #FB0 #FC0;
不支持-moz-border-colors的写法。
查看演示
图像填充边框 border-image
允许对边框进行图像填充，熟悉PS的应该比较能够容易理解。目前只有Safari支持此属性（下载Safari for windows）。填充方式有平铺方式(round)和伸展方式(strentch)。
-webkit-border-image: url(img/border.gif) 6 6 6 6 round round;
查看演示
圆角边框 border-radius
在CSS2时代圆角边框的设计方法有很多，但是相对来说都比较麻烦，css3彻底解决这一问题。在CSS3圆角边框的构建只需一句简单的CSS代码即可。同时支持对某一个角设置圆角。Firefox，Safari目前均已支持此属性。
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
查看演示
投影 box-shadow
CSS3.info称该属性是css3中最优秀的一个属性(Box-shadow, one of CSS3’s best new features)。该属性的确减少了大量的设计工作，以后的阴影效果只需CSS代码就可实现。该属性有4个参数，第一个数值为投影的水平偏移距离，第二个数值为投影的垂直偏移距离，第三个为投影的模糊范围，最后一个为投影颜色。目前仅Safari支持此属性。
-webkit-box-shadow:10px 10px 10px #888;
查看演示
背景大小 background-size
自定义背景图像的现实尺寸。Opera，Safari和Konqueror皆支持该属性，Firefox不支持。
-o-background-size: 200px 150px;
-webkit-background-size: 200px 150px;
-khtml-background-size: 200px 150px;
查看演示
多重背景 Multiple backgrounds
为对象定义多个背景，各背景之间以逗号分隔。Safari，Konqueror均支持该属性。
background:url(img/bg_1.jpg) left top no-repeat,
url(img/bg_2.jpg) left bottom no-repeat,
url(img/bg_3.jpg) right top no-repeat,
url(img/bg_4.jpg) right bottom no-repeat;
查看演示
文本投影 text-shadow
该属性在CSS2中就被写入，但是目前只有Safari和Opera支持。其语法与box-shadow相似。
text-shadow:2px 2px 2px #000;
查看演示
文本溢出 text-overflow
可选属性值：clip，ellipsis，ellipsis-word。该属性在IE6+版本，以及Opera中有较好的支持。
text-overflow:ellipsis;
查看演示
自动换行 word-wrap
该属性本是IE的专用属性，被写入CSS3。主要用于解决长单词的自动换行，可选值normal，break-word。IE，Safari支持该属性，firefox不支持。
word-wrap:break-word;
查看演示
变化尺寸 resize
鼠标拖动改变对象大小。可选值：none | both | horizontal | vertical | inherit。Safari，Konqueror支持。
resize: both;
查看演示
外边框 outline
与outline-offset属性一起使用用于设置对象外边框。Opera，Safari和Firefox均支持该属性。
outline:2px solid #F03;
outline-offset:15px;
查看演示
高级属性选择器 Attribute selectors
属性选择器其实CSS2就有定义，并被用来作为css hack方法，因为IE6及以前版本并不支持属性选择器。CSS3中对属性选择器进行了扩展，其功能引入类似正则表达式模式。目前IE7，Firefox，safari，Opera均支持高级属性选择器。
div[id^="my"]{ color:#C00;}
div[id$="http"]{ color:#00F;}
div[id*="other"]{ color:#000; text-decoration:underline;}
div[id~="other"]{/*------*/}
查看演示
CSS3的新属性还有很多，部分属性目前没有任何浏览器支持，故在此不作讨论。也有部分浏览器已经支持的属性也未涉及，诸如HSL colors，HSLA colors，opacity，RGBA colors，background-origin，background-clip…诸多属性均未言及。本文内容主要参考自CSS3.info以及w3c，在此只为抛砖引玉，小作介绍，详细信息还请移步至上述两网站。
