多语言展示
当前在线:1076今日阅读:26今日分享:39

Sass(Scss)的导入、注释和混合器

Sass(Scss)的导入、注释和混合器导入Sass / Scss文件、Sass和Scss中的注释、混合器
工具/原料
1

HBuilder(自动编译)

2

html,sass/scss

方法/步骤
1

导入sass/scss文件1.可以直接在sass/scss文件中导入    @import ' css/sass.scss' (后缀名可以省略@import ' css/sass')2.嵌套导入:   css.scss文件(div{ color : #f00 ; })   sass.scss文件(nav{ @import ' css ' })

2

sass/scss的注释1. ' // ' : 这种注释不会出现在生成后的css文件中2. ' /* */ ' : 这种会出现在生成后的css文件中

3

混合器(避免属性和属性值的重复)(混合宏)声明:@mixin调用:@include

4

混合器:不带任何值的参数先设置变量名,再给变量名设置参数(相当于js中的函数一样function( ))

5

传一个带值参数(传入一个默认值)在设置变量名同时设置参数

6

传多个参数值@mixin size($width,$height){    width:$width;    height:$height;}.div{//  @include size(300px,100px);//按顺序    @include size($width:300px,$height:100px);//不按顺序}(可以不用按顺序)

注意事项

个人经验,如有不明白的地方可以提出疑问

推荐信息