分開你的CSS

其實我一直以來就很想將CSS拆開成不同檔案

可是在w3school.com似乎沒有教


今天意外看到某網站的原始碼看到可以利用 @import url('xxx.css');的方式import其他css檔進來

那就開始教學囉~

你可以在標籤中直接使用

例如:

<style type="text/css">
@import url("a.css");
@import url("b.css");
@import url("c.css");
</style>

來取代你之前的

<link rel='stylesheet' href='a.css' type='text/css' />
<link rel='stylesheet' href='b.css' type='text/css' />
<link rel='stylesheet' href='c.css' type='text/css' />

也可以直寫在css檔裡面

@import url("a.css");
@import url("b.css");
@import url("c.css");
/*其他的css樣式*/
.content{...}:

這樣一來如果要分類各css是不是可以很一目了然呢~