使用@import声明是不好的做法？

Question

  

可能重复：
  Difference between @import and link in CSS

我读过关于CSS @import的一个不好的做法，并且想知道我正在使用的方法。

我目前正在使用WordPress构建一个网站，它通过链接引用导入每个插件的样式表，主样式表以相同的方式链接，但是，主样式表当前包含几个@import声明，我相信我应该将标题或移到他们使用的相应页面中（其中两个仅用于某些页面）。

我的担忧是否合理，以及使用这些@import声明的含义是什么？

Answer 1

网络提供了很多关于这个主题的信息，我建议阅读：

• http://www.stevesouders.com/blog/2009/04/09/dont-use-import/
• @import vs link
• @import or <link> for importing stylesheets?

Answer 2

我认为您应该使用LINK来简化 - 您必须记住将@import放在样式块的顶部，否则它将无效。事实证明，避免@import对性能更好。

链接

• 链接是在网页上包含外部样式表的第一种方法。它旨在将您的网页与样式表链接在一起。

导入

• 导入允许您将一个样式表导入另一个样式表。这与链接方案略有不同，因为您可以在链接的样式表中导入样式表。

使用@import的最常见原因是因为较旧的浏览器无法识别@import，因此您可以隐藏它们的样式。

此链接将解决您的所有疑问

What's the Difference Between @import and link for CSS?

Answer 3

使用导入规则本身并不坏。您只需要记住，只有在下载包含它们的文件后才能处理导入。因此，如果你有一堆带有这些陈述的文件，你的观众可能需要很长时间才能看到所申请的CSS。

每个@import语句都会创建一个新的http请求，因为它发生在客户端。因此，从这个角度来看，您正在通过Edge或3G等移动访问者的缓慢连接来伤害访问者。

根据经验，我听到很多是立即合并你需要的所有CSS，并且只使用@import来处理你以后需要的东西。

Answer 4

出于速度原因，最好不要在页面中使用 @import 来包含 CSS 。

导入可让您导入一个样式表到另一个样式表。这与链接方案略有不同，因为您可以在链接的样式表中导入样式表。较旧的浏览器无法识别 @import ，因此您可以隐藏它们的样式，这是 @import 的原因。

检查一下：
http://www.stevesouders.com/blog/2009/04/09/dont-use-import/
css @import