CSS3入门:由点到面
作为Web社区,我们已经在CSS3方面取得了很大的进步。当我们开始使用background-clip和过渡动画(transition/animation)等可视化效果时,text-shadow和border-radius已经司空见惯了。我们似乎花了大量的时间争论何时或如何引入这些属性。一个特性不兼容所有浏览器或暂时未完全文档化,并不意味着我们不应该使用它。对此,我持相反态度。
我们可以利用业余时间在博客文章里讨论总结出CSS3的最佳实践。开发者绞尽脑汁,通过大量实验创造出了一些极具创新且合理的方法供大家来更好地掌握CSS3。现在,有大量的特性结合和使用点等待着我们去挖掘,动起手来吧!
如何起步?
我最喜欢做的事情之一就是浏览CSS特性列表并考虑哪些组合在一起使用更合理。如果我将@font-face和text-shadow、bg-clip:text联系在一起可行吗?webkit-transition和opacity呢?以下是我最近的一些实验结果。虽然有一些可能比其他的更实用,但主要是抛砖引玉,通过新颖的方式鼓励大家去实践。
注:以下的实验效果只适用于Google Chrome或Safari等Webkit内核浏览器。
案例一:CSS3过渡效果
CSS3可视化效果可以从color、background或border等的鼠标悬停(hover)CSS基础特性开始。首先,我们针对链接颜色设置0.4秒的过渡变换效果。
相关CSS3入门:由点到面
咨询热线:020-85648757 85648755 85648616 0755-27912581 客服:020-85648756 0755-27912581 业务传真:020-32579052
广州市网景网络科技有限公司 Copyright◎2003-2008 Veelink.com. All Rights Reserved.
广州商务地址:广东省广州市黄埔大道中203号(海景园区)海景花园C栋501室
= 深圳商务地址:深圳市宝源路华丰宝源大厦606
研发中心:广东广州市天河软件园海景园区 粤ICP备05103322号 工商注册