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