css - @导入与链接

标签 css import

首先我知道标题说这是一个重复的问题 here , here , 和 here .我读到的关于这个主题的所有内容都已有两年多的历史了。那个时期发生了很多变化,所以同样的想法是否仍然可取?

这是一个示例,我在样式表中使用@import 来引入我的重置 CSS 和其他几个样式。我应该将其从 @import 更改为至 <link> ?根据这个article我应该使用链接。所以我问其他开发人员,什么是真正最好的日期(2011 年 8 月 25 日)

最佳答案

在过去的一两年中,即使有任何变化,也没有太大变化,而且从那时起我们仍在处理许多相同的浏览器,因此您不应该改变您的做法。

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

您可以在此处查看详细信息:

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

所以,虽然 @import可能很方便,仅此而已。如果你真的想利用快速加载时间,使用最少数量的样式表(在大多数情况下可能是一个),用高效的选择器(通常的东西)编写好的 CSS,缩小它,并使用 <link>标签。


这本来是一条评论,但它太长了:

而不是 @import (我知道这 非常方便),您应该在网站上线时将这些文件合并为一个文件。无论如何你不应该在那个时候进行调整,并且有许多工具可以帮助缩小它。就个人而言,使用 PHP,我有一个配置文件,我在其中定义了所有写入单独 CSS 文件的 CSS 文件(我将在 <link> 标记中引用的文件),然后如果缓存版本是旧的(手动确定)或自动),它将它们组合/缩小并将内容写入“缓存”文件,并返回一个时间戳查询字符串以附加到 CSS 文件名以强制重新下载。

如果您也在使用 PHP,我强烈推荐 cssmin , 它可以解析 @import 的样式表并将内容拉入一个文件,并处理缩小的所有方面。

关于css - @导入与链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7199364/

相关文章:

javascript - 单击功能淡出并淡出。此函数在另一个 img 之上显示 img,但与屏幕尺寸不匹配

sql-server - 如何将文件中的数据导入到 SQL Server 数据库的单个列中?

java - 导入包会改变类的可见性吗?

javascript - 当我将鼠标悬停在按钮的边缘时,如何让我所有的栏都变成黑色?

css - 表单向上移动并与导航栏重叠

javascript - 使用 Skrollr.js 制作圆形边框动画

python - 如何添加到jupyter lab中的pythonpath

javascript - 在 ionic 框架中选择带有 ionic 无限滚动的顶部元素

python-2.7 - 使用命名空间时如何导入函数?

javascript - JS 在文件之间导入数组