SCSS语法：
假设变量申明带有!default，那么如果在此申明之前没有这个变量的申明，则用这个值，反之如果之前有申明，则用申明的值。 ‘...’传递多个参数：
@mixin box-shadow($shadow...){
-webkit-box-shadow:$shadow;
-moz-box-shadow:$shadow;
box-shadow:$shadow;
} 用在属性或者选择器上，就得以#{}包裹 多个变量值一起申明：
$linkColor: red blue !default;
a{
color:nth($linkColor,1);
&:hover{
color:nth($linkColor,2);
}
} 定义变量:$名字
引用方式:$变量名
颜色：
$linkColor: #08c;
a {
text-decoration:none;
color:$linkColor;
/***&代表其上级***/
&:hover{
color:darken($linkColor,10%);
}
} 嵌套：f1{
f2{
f3{}
}
} 导入：@import '具体的路径/文件名' 方法定义：@mixin box-sizing ($sizing) {
-webkit-box-sizing:$sizing;
-moz-box-sizing:$sizing;
box-sizing:$sizing;
}
.box-border{
border:1px solid #ccc;
/****此处为调用*****/
@include box-sizing(border-box);
} 扩展（继承）：
.message {
border: 1px solid #ccc;
padding: 10px;
color: #333;
} .success {
@extend .message;
border-color: green;
} .error {
@extend .message;
border-color: red;
} .warning {
@extend .message;
border-color: yellow;
} 运算：
.container { width: 100%; }
article[role="main"] {
float: left;
width: 600px / 960px * 100%;
}
aside[role="complimentary"] {
float: right;
width: 300px / 960px * 100%;
}
SCSS语法初级
hbuilder 下scss保存预编译到指定目录下配置：
1、触发命令地址：D:\Ruby22\bin\scss.bat （这个是安装ruby的bin下）
2、命令参数：--sourcemap=none --no-cache %FileName% ../css/%FileBaseName%.css --style compact
HBuilder Scss预编译配置
一 搭建环境 首先安装ruby环境,不然会编译失败，在这里下载ruby ，安装的时候选择第二项 在cmd中输入gem -v 显示版本号说明ruby安装成功 待ruby安装成功后，在cmd中输入 gem install sass 来安装sass，如图 如果sass安装失败需要设置淘宝镜像 gem sources --remove https://rubygems.org/ gem sources -a https://ruby.taobao.org/ 二 在sublime中安装插件 1）在sublime中安装插件：Sass和SASS Build； 2）创建sass文件并保存为.scss格式； 3）Ctrl+B，选择SASS编译
sublime、scss环境搭建
1、task:
作用：定义一个任务
格式：gulp.task(name[, deps], fn)
说明：
name，表示任务的名字，使用字符串，不能使用空格。
deps，包含任务列表的数组，先于当前任务而执行。
fn，任务要执行的一些操作。 2、作用：指定需要处理的源文件的路径，返回当前文件流至可用插件。
格式：gulp.src(globs[, options])
说明：
globs：需要处理的源文件匹配符路径，字符串或字符串数组。可以使用类似正则的方式来进行文件的匹配。常见的用法有：
“src/a.js"，指定具体某个文件
“*”, 匹配某个文件夹下的所有文件，如src/*.js，
“**”， 匹配0个或多个子文件夹，如src/**/*.js，
“{ }”，匹配多个属性，如src/{a,b}.js ，包含a.js和b.js，再如 src/*.{ jpg, png, gif } 表示src所有的jpg/png/gif文件
“！”，排除文件，如 ！src/a.js，不包含src下的a.js文件 3、作用：指定处理完后文件的输出路径
格式：gulp.dest(path[, options])
说明：
path：字符串或函数，如果是字符串，直接指定文件输出路径，如果是函数，需要在函数中返回输出路径。 4、gulp借鉴了Unix操作系统的管道（pipe）思想，前一级的输出，直接变成后一级的输入。
一般都是用在 src 方法和 dest方法 之间。 5、作用：watch方法用于监听文件变化，文件一修改就会执行特定的任务。
格式：gulp.watch(glob[, opts], tasks)
说明：
glob：需要处理的源文件匹配符路径，用来指定具体监控哪些文件的变动，和src中的一致。
tasks：需要执行的任务的名称数组 -------------------------------------------------------------------------------- npm install [-g] 包名[,...][|包名@版本] --save|--save-dev
npm uninstall|update 包名 (本地卸载|更新)
npm uninstall|update -g 包名 (全局卸载|更新)
本地查看 npm ls
全局查看 npm ls -g
查看顶层的包。可以使用npm ls --depth=0
npm info 包名 （查看某个包/模块的信息）
npm、gulp配置