CSS中“@import”的用法

在你完成一个比较大的网站项目时，你的样式表中的代码量是相当庞大的，也许会有很多不同模块的CSS声明及注释。这种情况下，你可以考虑使用将一个庞大的样式表切割成几个不同模块的小样式表，然后再用@import将他们组合起来。

HTML
你可以像平常一样调用一个样式表

<linkrel="stylesheet"type="text/css"href="styles.css"/> 

CSS – styles.css
这时styles.css作为你的主样式表，它将负责调用其它子样式表。(我会把子样式表放在’styles’ 目录下以便于组织管理，纯属个人习惯，你也可以有自己的习惯)

@import "styles/main.css";
@import "styles/checkout.css";
@import "styles/shoppingcart.css";

译者注:@import虽然能够为某个大的CSS文件减肥，但是它在页面读取方面(尤其IE)还是有弊端的。感兴趣的读者可以看看这篇文章:
《Don’t Use @import》