sass

sass基於Ruby語言開發而成，所以安裝sass前須要安裝Ruby。（注:mac下自帶Ruby無需在安裝Ruby!）

 

sass官網

https://www.sass.hk/install/

 

windows安裝ruby

https://www.jianshu.com/p/a2640d3476f8

 

sass 是否安裝

ruby -v

 

 

sass國內鏡像地址改變了

gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/

 

 

 

vscode安裝sass

https://blog.csdn.net/qq_35697034/article/details/78251173

 

hbuilder安裝sass

https://blog.csdn.net/chasteblessing/article/details/80430680

 

定義Mixins

 經過@mixin加名稱的方式就能夠定義一個Mixins模塊，在模塊內你能夠添加任何你想重複使用的樣式。

@mixin button {  
    font-size: 1em;  
    padding: 0.5em 1.0em;  
    text-decoration: none;  
    color: #fff;  
}

因爲歷史緣由，連字符和下劃線被認爲是相同的，也就是說 @mixin button-large { } 和 @mixin button_large { } 是同樣的。

Mixins可以包含任何在 CSS 和 Sass 中有效的內容。

使用@mixin指令

你能夠經過@include來調用具備相同名稱的mixin模塊。

.button-green {  
    @include button;  
    background-color: green;  
}

https://www.sass.hk/skill/sass142.html

 

 

 

1

2

3

4

5

6