随着CSS的发展，CSS3新增一些有关Borders、Colors、Text effects 等属性，丰富了页面的显示效果，甚至可以代替某些图片样式（例如阴影等）。
颜色及透明度 RGBA用法：background:rgba(red,green,blue,alpha)
说明：
[list=1]
[]alpha ：取值0到1，0代表完全透明，1代表不透明。
[]red，green，blue ：取值0到255，代表十进制颜色，例如白色#ffffff（16进制）换算成10进制为（255，255，255）。
[*]RGBA属性可以应用在于颜色有关的所有标签上，例如 字体颜色（font color），边框颜色（border color），背景颜色（backgr color），阴影颜色（shadow color）等。
[/list]示例：
HTML
RGBA示例
背景颜色为白色（#000000），透明度为0.2
background-color: rgba(0,0,0,0.2);
); width: 600px; margin-right: auto; margin-left: auto; background-repeat: no-repeat; height: 200px;}.rgba { padding: 20px; width: 600px; background-color: rgba(0,0,0,0.2);}[b]RGBA 预览：[/b]
[url=http://renniaofei.com/blog/wp-content/uploads/2010/03/the-basics-of-css3-preview.html]
[/url]
[b]文字阴影 Text Shadow[/b][b]用法：[/b]text-shadow:x-offset y-offset blur color;
[b]说明：[/b]
[list=1]
[*]x-offset：x方向偏移距离
[*]y-offset：y方向偏移距离
[*]blur：模糊程度（也可以理解为扩散程度）
[*]color：颜色
[*]可添加多重阴影，例如text-shadow: 0 1px 0 #fff, 0 -1px 0 #000;
[/list][b]示例：[/b]
HTML:
Text Shadow
text-shadow:2px 3px 2px #000; font-size: 48px; color: #009999;
[/url]
[b][url=http://renniaofei.com/blog/code/border-radius-create-rounded-corners-with-css3/]边框圆角 Border Radius[/url][/b][b]用法：[/b]
border-radius: 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
[b]说明：[/b]
[list=1]
[*]-webkit-border-radius 适用基于webkit的浏览器
[*]-moz-border-radius 适用于firefox浏览器
[*]根据需要可设置每个角的半径例如设置左上角的边框半径的CSS代码如下：-webkit-border-top-left-radius: 5px;-moz-border-radius-topleft: 5px;
[/list][b]边框圆角预览[/b]:
[url=http://renniaofei.com/blog/wp-content/uploads/2010/03/the-basics-of-css3-preview.html]
[/url]
[b]Box Shadow[/b]用法于text shadow类似：box-shadow:x-offset y-offset blur color;
[b]box shadow 预览[/b]:
[url=http://renniaofei.com/blog/wp-content/uploads/2010/03/the-basics-of-css3-preview.html]
[/url]
说明：考虑到CSS代码的兼容性，请尽量添加下面的代码
-webkit-box-shadow: 0 2px 12px rgba(0, 0, 0, .3);
-moz-box-shadow: 2px 4px 15px rgba(0, 0, 0, .3);