sass高级语法

github地址:https://github测试数据/lily1010/sass/tree/master/course03

用到的sass语法是:

sass --watch test.scss:test.css --style expanded

如下图:

1 导入外部文件,缺省文件后缀默认是sass/scss文件,一般在头部声明

test.scss内容是:

 @import "lili.scss";  //导入一个文件
@import "lili.scss", "haha.scss"; //导入两个文件 
/*但在以下情况下， 仅作为普通的 CSS @import 规则语句，不会导入任何 Sass 文件。
*(1) 如果文件的扩展名是 .css。
*(2) 如果文件名以 http:// 开始。
*(3) 如果文件名是 url()
*(4)如果@import 中包含任何的媒体查询（media queries)
*/
@import "lili.css";
@import "http://foo测试数据/bar";
@import url(lili);
@import "lili" screen;

/*在import里面插入动态变量,但是仅适用于url方式*/
$name:family;
@import url("http://fonts.googleapis测试数据/css?family=#{$name}");

/*导入scss文件,却不需要将它编译为css文件做法:
 *(1)新建一个文件夹,为了将不需要编译的文件和需要编译的文件分开,这点千万注意
 *(2)在已经建好的文件夹里面,将不要编译的*.scss文件命名为_*.scss
 *(3)导入的时候不要用下划线,直接@import("新建文件夹名字/*.scss")
 */  

查看更多关于sass高级语法的详细内容...