LMLPHP后院

扫码查看  原文链接 : https://blog.lmlphp.com/archives/276/The_use_tutorial_of_CSS3_import_external_CSS_file_at_import  来自 : LMLPHP后院

在网页开发中载入 CSS 文件，比较常见的都是使用 <link> 标签，偶尔也会发现有些网站的做法是在载入的 CSS 文件中再使用 @import 载入其他的 CSS 文件。

大家有没有想过，这样做有什么意义呢？本文主要目的倒不是为了解释 @import 的用法，因为 CSS 中类似 @ 这样的方法特别多，讲起来也是讲不完的。当我看到这个做法之后，我表示不能理解，我觉得这样的做法是很不明智的，正是因为这个原因，我才要去了解下为什么要发明 @import 这个东西。

在 MDN 和 MicroSoft Developer Network 中了解了一番，依然还是没能理解万维网的设计者们为什么要设计出这样一个不是很实用的东西出来，不过它的用法和注意事项还是可以分享一下的。也许当初设计这样一个东西就是为了提供这样一个功能吧，方便特殊情况使用？。有过网站开发经验的人一定不会傻到在一个静态资源里面去加载另一个资源吧，除非不是你所能控制的万不得已的情况下。

看看 MDN 的原版解释。

@import

The @import CSS at-rule is used to import style rules from other style sheets. These rules must precede all other types of rules, except @charset rules; as it is not a nested statement, @import cannot be used inside conditional group at-rules.

简单翻译下：@import CSS 规则用来加载外部样式表，这个规则必须声明在所有规则之前，除了 @charset 之外；因为它不是一个嵌套语句块，@import 不能放在条件规则组里面，比如 @screen 里面。

@import 语法规则

@import url(http://www.lmlphp.com/main.css);