|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
你的设计不仅仅用于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>
声明块由一个一个的声明组成,声明由属性和值组成,属性和值用冒号隔开,分号结束。 |
|