日期:2014-01-28 浏览次数:21007 次
级联款式表在13年前被引入,而且被广泛使用的CSS 2.1 标准在11年前被创建,显然我们如今曾经与当年相差千里了。相当了不起的是期间网站开发有了多少进步——理想上,我们也无法想象。
为什么会这样呢,当提到CSS的时候,过去我们是如此的不情愿和害怕尝试?为什么我们还要使用讨厌的hack和依赖JavaScript的技术来写款式?为什么我们不能利用丰富的CSS3 特性和现代浏览器中可用的工具 并将我们的设计质量带到下一个等级?
是时候在我们的项目中引入CSS3 特性了,不用害怕逐渐在我们的款式表中加入css3特性和选择器会出问题。让我们的客户认识到CSS3的优势 (而且让旧浏览器更快的消逝)是我们力所能及的事情——我们应该这样做,特别是在它能够让网站愈加灵活并减少开发和维护成本的时候。
在本文中,我们将研讨CSS3的优势,并看一下一些网页设计师是如何使用它们的。最后,我们将了解到从CSS3中我们能得到什么以及我们如何在我们的项目中使用它的新特性。
同时请参考我们之前的一篇相关文章:
为了使用大部分CSS3特性,我们不得不与原来的属性一同使用生产商专有扩展。缘由是直到如今,大部分浏览器只支持部分CSS3属性。而且不幸的是,一些属性甚至到最后都可能不被W3C推荐,所以通过指定浏览器专有属性,将他们与标准属性区分开来是很重要的(然后在他们是多余的的时候使用符合标准的款式将之覆盖)。
当然,这种方法的劣势是,将导致一个芜杂的款式表和网站在浏览器之间的表现不分歧。毕竟,我们不想在我们的款式表中重拾私有浏览器hack的需求。Internet Explorer的臭名昭著的marquee、blink以及其它标签在大量款式表中被使用,并在20世纪九十年代成为一个传奇;它们仍然让现存的很多网站(在其他浏览器中)表现不分歧甚至难以阅读。而我们如今也不想将我们本人置于同样的境地,对吧?
然而,网站不需求在所有的浏览器中看起来必须严厉的分歧。有的时候在某个浏览器中使用私有属性来实现特定的效果是可行的。
最常见的私有属性是用于Webkit核心浏览器的(比如, Safari), 它们以-webkit-开始,以及Gecko核心的浏览器(比如, Firefox),以-moz-开始,还有Konqueror (-khtml-)、Opera (-o-) 以及Internet Explorer (-ms-)都有它们本人的属性扩展(目前只要IE8支持-ms-前缀)
作为专业的设计师,我们不得不留意:使用这些私有属性将让我们的款式表不能通过验证。所以目前将他们放到最终版的款式中是少见的。但是在某种情况下,比如试验或学习,我们至少可以考虑将他们和标准的CSS属性一同写到一个款式表中。