sass 基础
Posted final-elysion
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了sass 基础相关的知识，希望对你有一定的参考价值。
sass 基础
环境搭建
- 安装ruby
- gem install sass
基础指令
编译:
sass input.scss output.css --style expanded
动态编译单个文件:
sass --watch input.scss:output.css --style expanded
动态编译文件夹:
sass --watch sass/:css/ --style expanded
语法
基本语法
- 嵌套
父选择器 &
&必须作为第一个字符
- 属性嵌套
- 占位符选择器 %
多行和单行注释
/* */ // 单行注释编译时会忽略
SassScript
变量
$myWidth:100px;
.test{
width:$myWidth;
}取值
$mytext = "hello"
/* #{ $mytext } */运算
- +, -, *, /, %
- <, >, <=, >=
- ==, !=
函数
@function function-name($args) {
@return value-to-be-returned;
}参考文档
以上是关于sass 基础的主要内容，如果未能解决你的问题，请参考以下文章