来看看：CSS3殊效实例:11个CSS3代码殊效实例教程

你的设计不仅仅用于web浏览器，也可以发布在其他设备上，比如PowerPoint。
破洛洛文章简介：比来花了好些工夫收拾了一下CSS3的殊效，使用对照直不雅易懂的体例体现出来跟人人分享一下，但愿人人会有一点点的劳绩。
比来花了好些工夫收拾了一下CSS3的殊效，使用对照直不雅易懂的体例体现出来跟人人分享一下，但愿人人会有一点点的劳绩。
个中“-moz-”一样平常指火狐的写法，“-webkit-”一样平常指webkit内核扫瞄器的写法.
1、border-radius完成圆角效果，只需一行CSS代码即可以完成，撑持浩瀚扫瞄器，固然不撑持IE。

登录/注册后可看大图

2、border-top-left-radius设置圆角各个角的半径值（不撑持IE）
[img=466,493alt=]http://ued.iciba.com/wp-content/uploads/2010/08/1.1.2圆角分歧的值1.png[/img]

3、box-shadow完成暗影效果(不撑持IE)
[img=466,268alt=]http://ued.iciba.com/wp-content/uploads/2010/08/1.2.1暗影效果1.png[/img]

4、css3完成暗影和圆角完善分离，团体感到这类效果挺不错的，很有平面感。
[img=466,355alt=]http://ued.iciba.com/wp-content/uploads/2010/08/1.2.2暗影和圆角1.png[/img]

5、当他人呆板上没有这类字体，而你又想让页面上设置成这类字体时，不防思索将字体上传到服务器，只必要设置一个绝对路径和字体称号就行。复杂吧？

登录/注册后可看大图

6、text-shadow完成多重暗影效果，打造炫丽色采。
[img=466,242alt=]http://ued.iciba.com/wp-content/uploads/2010/08/1.3.2字体暗影.png[/img]
7、opacity完成背景通明度（不撑持IE）
[img=466,443alt=]http://ued.iciba.com/wp-content/uploads/2010/08/1.4.1背景图片通明1.png[/img]

8、transform:translate(X轴,Y轴)完成物体挪动：
[img=466,362alt=]http://ued.iciba.com/wp-content/uploads/2010/08/1.5.1挪动.png[/img]
9、transform:scale(倍数)完成缩小减少。
[img=466,362alt=]http://ued.iciba.com/wp-content/uploads/2010/08/1.6.1改动巨细.png[/img]
10、transform:skew()将元素发生透视效果

登录/注册后可看大图

11、transform:rotate(度数)将元素扭转X度
[img=466,362alt=]http://ued.iciba.com/wp-content/uploads/2010/08/1.7.2扭转1.png[/img]
</p>
声明块由一个一个的声明组成,声明由属性和值组成,属性和值用冒号隔开,分号结束。