1、学习网站 sass中文网http://www.sasschina.com/guide/
http://www.w3cplus.com/sassguide/syntax.html
http://www.sass-zh.com/quickstart.html
2、在vs---工具——扩展和更新——搜索web compiler并安装。如果不安装的话,不能解析scss文件
3、在content中添加scss(sass两个是一个)文件,在他子项中自动编译出css文件,html文件中直接引用css文件即可
4、sass优势
(1)使用变量编程,易于修改维护。比如颜色变量,
$highlight-color: #F90;
$highlight-border: 1px solid $highlight-color;
.selected { border: $highlight-border; }
(2)方便父子元素样式嵌套编写
#content {
article {
h1 { color: #333 }
p { margin-bottom: 1.4em }
}
aside{
background-color: #EEE
}
}
/* 编译后 */ #content article h1 { color: #333 }
#content article p { margin-bottom: 1.4em }
#content aside { background-color: #EEE }