@import vs链接

首先我知道标题说这是一个重复的问题, 在这里 , 这里和这里问。 我在这个主题上读到的所有东西都已经有两年多了。 那段时间很多变了,所以同样的想法还是可取的?

下面是一个例子,我使用样式表中的@import来引入我的重置CSS和一些其他样式。 我应该从@import更改为<link>吗? 根据这篇文章,我应该使用链接。 所以我问其他开发者,到目前为止最好的方法是什么(2011年8月25日)

如果在过去的一两年里发生了什么变化,并没有什么变化,我们仍然在处理大量相同的浏览器,所以你不应该改变你的做法。

在所有情况下, <link>都优先于@import ,因为后者会阻止并行下载,这意味着浏览器将等待导入的文件完成下载,然后开始下载其余的内容。

你可以在这里看到很详细的内容:

http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

所以,虽然@import可能很方便,但它只是提供了。 如果你真的想要利用快速的加载时间,使用最less数量的样式表(大多数情况下可能是一个样式表),用有效的select器(通常的东西)编写好的CSS,缩小它,并使用<link>标签。


这将是一个评论,但它太长了:

而不是@import (我知道这很方便),你应该把这些文件合并成一个,当你的网站上线。 不pipe怎样,你不应该在这方面进行调整,并且有很多工具可以帮助缩小它。 就个人而言,使用PHP,我有一个configuration文件,我定义了所有的CSS文件写入到一个单独的CSS文件(我将在<link>标记中引用的那个文件),然后如果caching版本是旧的(手动确定或自动),它将它们合并/缩小并将内容写入“caching”文件,并返回时间戳查询string以追加到CSS文件名,以强制重新下载。

如果您也使用PHP,我强烈build议使用cssmin ,它可以为@importparsing样式表,并将内容拖放到一个文件中,以及处理缩小的所有方面。