Sass 導入

Sass 使 CSS代碼保持DRY（也就是不要重複），編寫代碼的一種方式是將相關的代碼保存在單獨的文件中，咱們能夠建立帶有CSS片斷的小文件，以包含在其餘Sass文件中，好比：重置文件、變量、顏色、字體或者是字體大小等等。

導入文件

與CSS同樣，Sass也支持 @import 指令，它容許咱們將一個文件的內容包含在另外一個文件中，可是因爲性能問題，CSS指令有一個缺點是咱們每一次調用都會建立一個額外的HTTP請求，可是Sass的@import指令將文件包含在CSS中，所以它每次在運行時不須要額外的HTTP調用。

Sass 導入語法：

@import filname;

注意：不須要指定文件擴展名，Sass會自動默認後綴名.scss或.sass文件。使用@import指令導入文件，咱們能夠定義任何變量或混合，導入任意數量的文件。

Sass 擴展了 @import 的功能，容許它能夠導入 SCSS 或者是 Sass 文件，被導入的文件將合併編譯到同一個 CSS 文件中，另外，被導入的文件中所包含的變量或者混合指令均可以在導入的文件中使用。

Sass 可使結構清晰化，減小了代碼的重複編寫，加強了代碼的可讀性，可是當代碼量比較大時，就會出現一些問題，咱們須要拆開多個樣式文件，css 和 sass 都有 @import 規則，二者的區別在於：前者運行@import 時須要加載外部 css ，這樣一來容易使得網頁加載速度變慢，而 sass 會直接在當時就會馬上加載外部文件，更加方便快速。

Sass部分

默認狀況下，Sass直接傳輸全部.scss文件，可是當咱們想要導入一個文件時，不須要直接將該文件轉譯。Sass有一種機制：若是文件名如下劃線開頭，Sass將不會對其進行轉換，這樣命名的文件在sass中稱爲部分文件。

一個部分Sass文件用一個前導下劃線命名，部分語法：

_filename;

默認變量值

Sass 的同一變量若是屢次聲明，那麼後面的樣式就會覆蓋前面的樣式，咱們可使用 !default 的方式，來將某同樣式聲明爲默認公共樣式，當導入文件對這一變量有賦值時，那麼將它賦值，不然就爲默認值。

嵌套導入

跟原生的 css 不一樣，sass 容許 @import 命令寫在 css 規則內。這種導入方式下，生成對應的 css 文件時，局部文件會被直接插入到 css 規則內導入它的地方。

原生導入

sass 一般會在 @import處以 sass 格式導入文件，也能夠兼容 css，當如下三種狀況出現時，會以原生的方式導入，這會形成瀏覽器的額外下載：

• 文件後綴是 .css
• 被導入的文件是一個 url 地址
• 被導入的文件是 url() 的值