《HTML5与CSS3实战指南》——1.5 我们为什么应关注CSS3

    xiaoxiao2024-04-18  10

    本节书摘来自异步社区《HTML5与CSS3实战指南》一书中的第1章,第1.5节,作者: 【美】Estelle Weyl , Louis Lazaris , Alexis Goldstein 更多章节内容可以访问云栖社区“异步社区”公众号查看。

    1.5 我们为什么应关注CSS3

    在这本书的后面,我们将详细介绍CSS3的新功能。同时,我们将告诉您为什么CSS3的新技巧能够令网络开发人员兴奋。

    一些设计技巧几乎在每一个项目中都会得到应用。投影、渐变和圆角是3个非常好的示例。它们应用在每一个地方。只要应用恰当,并与网站的整体主题和目的一致,这些技术的改进会为整个设计增添光彩。

    可能您在想:我们使用CSS创建这些设计元素已经很多年了。我们还有必要学这些吗?

    过去,为了创建渐变、投影及圆角,网络设计人员必须求助于许多棘手的技巧。有时,还需要一些其他的HTML元素。在某些情况下,HTML保持的相当整洁,但此时需要一些脚本使用技巧。以渐变为例,使用其他图标是不可避免的。我们忍受这种解决方法,是因为我们没有其他方法完成这些设计。

    CSS3允许我们以这种思想超前的方式使用这些和其他的设计元素,从而使我们在诸多方面受益:使标记整洁;从而便于使用人员及计算机进行访问;维护代码;减少不必要的图标以及更快载入网页。

    供应商前缀注释

    为了使用CSS3的一些新功能,需要包含几行特殊的代码。这是因为浏览器供应商在添加执行CSS3的一些新功能时,使用了自己的前缀版本属性。例如,在FireFox中转换元素时,需要使用-moz-transform属性;同样,在基于WebKit的浏览器中,比如,Safari和Google Chrome,您必须使用-webkit-transform属性。在有些情况中,为使用一个CSS属性,您可能必须添加4行代码。这可能似乎会丧失一些从避免黑客、图像及非语义标记所获得的益处。

    但是,浏览器供应商以这种方式执行这些新功能,理由如下:现在的规范还不是最终版本,在程序执行中,还有一些漏洞。因此,现在您在执行这些功能时,使用供应商前缀来提供数值,并且使用无前缀声明来提供每个属性的永久版本。当规范成为最终版本且实现经过完善后,浏览器前缀将被取消。

    即使用这些前缀来维护代码似乎需要很多工作,现在使用CSS3,仍然是利大于弊。除了需要改变一些前缀属性来修改设计元素外,维护基于CSS3的设计还是比通过图形程序更改背景图像或处理那些其他标记和黑客脚本所带来的弊端要容易一些。此外,如上所述,您的代码更不会过时。

    相关资源:敏捷开发V1.0.pptx
    最新回复(0)