@import有什么意义？

Question

有人可以解释使用@import语法比使用标准链接方法包含css有什么好处吗？

Answer 1

正如回答者所说,它允许您将CSS分成多个文件,同时只链接到浏览器中的一个.

也就是说,在高流量网站上下载多个CSS文件仍然是浪费.我们的构建脚本实际上在通过执行以下操作在发布模式下构建时"编译"我们的CSS:

• 缩小所有CSS文件(删除额外的空格和注释)
• 我们有一个"core.css"文件,它只是一个@import语句列表; 在编译期间,每个都被该文件的缩小的CSS替换

因此,我们最终在生产中使用了一个缩小的CSS文件,而在开发模式中,我们有单独的文件来简化调试.

Answer 2

如果你使用 <link>在HTML文件中 s,则所有这些文件都必须跟踪所有CSS文件.这显然使得更改和添加(包括CSS和HTML文件)更难.

使用时@import,您可以将理论上无限多的更改减少到一个.

Answer 3

它允许您将逻辑 CSS 文件分布在多个物理文件中。例如，有助于团队发展。当您有很多 CSS 文件想要按功能区域（一个用于网格，一个用于列表等）分隔时，也很有用，让它们可以在同一个逻辑文件中访问。