-
[Sass注释] 1、类似 CSS 的注释方式，使用 ”/* ”开头，结属使用 ”*/ ” 2、类似 JavaScript 的注释方式，使用“//”查看全部
-
@mixin generate-size($class,$small,$medium,$big){ .#{class}-small{font-size:$small;} .#{class}-medium{font-size:$medium;} .#{class}-big{font-size:$big;} } @include generate-sizes("header-text",12px,20px,40px); //编译出来后的CSS .header-text-small{font-size:12px;} .header-text-medium{font-size:20px;} .header-text-big{font-size:40px;} 2、使用@extend中使用插值 %update-status{ margin-top:20px; background:#f00; } .selected-status{ font-weight:bold; } $flag:"status"; .navigator{ @extend %updated-#{$flag}; @extend .selected-#{$flag}; }查看全部
-
通过占位符%placeholder声明的代码，不过不被@extend调用的话，不会产生任何代码 %mt5{ margin-top:5px; } %pt5{ padding-top:5px; } .btn{ @extend %mt5; @extend %pt5; }查看全部
-
[Sass]混合宏参数--混合宏的不足 在不同的地方调用一个相同的混合宏是，会生成冗余的代码块查看全部
-
[Sass]混合宏的参数 ·传一个不带值的参数 @mixin border-radius($radius){ -webkit-border-radius:$radius; border-radius:$radius; } .btn{ @include border-radius(3px); } ·传一个带值得参数 @mixin border-radius($radius:3px){ -webkit-border-radius:$radius; -border-radius:$radius; } .btn{ @include border-radius; }查看全部
-
·通过@mixin关键词声明一个混合宏， ·通过@include关键词调用声明好的混合宏 @mixin border-radius{ -webkit-border-radius:3px; border-radius:3px; } button{ @include border-radius; }查看全部
-
·全局变量：定义在元素外面的变量 ·局部变量：定义在元素内部的变量 $color: orange !default; .block{ color:$color; } .em{ $color:red; //定义局部变量 a{ color:$color;//调用局部变量 } } span { color:$color;//调用全局变量 } ？？什么时候声明变量 1.该值至少重复出现了两次； 2.该值至少可能会被更新一次； 3.该值所有的表现都与变量有关(非巧合) }查看全部
-
sass的默认变量仅需在值后面加上!default即可 sass 的默认变量一般是用来设置默认值，然后根据需求来覆盖的，覆盖的方式也很简单，只需要在默认变量之前重新声明下变量即可。查看全部
-
[Sass]声明变量 Sass的变量包括三个部分： 1.声明变量的符号$ 2.变量名称 3.赋予变量的值 $width: 300px;查看全部
-
Sass不同风格的输出方法 ·嵌套输出方式nested ·展开输出方式expanded ·紧凑输出方式compact ·压缩输出方式compressed查看全部
-
Sass常见的编译错误 字符编译，需要将文件编码设置为"utf-8" 中文字符，不要在文件命名时使用中文查看全部
-
一些编译Sass的GUI界面编译工具 ·Koala (http://www.w3cplus.com/preprocessor/sass-gui-tool-koala.html) ·CodeKit (http://www.w3cplus.com/preprocessor/sass-gui-tool-codekit.html)查看全部
-
【Sass】命令编译——最直接最简单的命令方式 在命令端口输入 单文件编译：sass <要编译的文件.sass>/style.scss:<要输出CSS的文件路径>/style.css 多文件编译：对整个项目中的所有sass文件进行编译 sass sass/:css/ *缺点，只能一次性编译。每次个性保存".scss"文件之后，都得重新执行一次这样的命令。 所以，开启wathc功能，只要，只要在代码进行任何的修改，都可以被自动检测到，并且直接给你编译出来。 sass -watch<要编译的Sass文件路径>/style.scss:<要输出CSS文件路径>/style.css 例子： sass --watch sass bootstrap.sass:css/bootstrap.css查看全部
-
·Sass只是一个预处理工具，不用<link>方式引用 ·Sass编译——要让web页面能调用Sass写好的东西，需要一个编译过程 ·编译方式:①命令编译 ②GUI工具编译 ③自动化编译查看全部
-
①Sass语法老规则，文件名后缀.sass，使用缩进语法，不带；和{} ②SCss语法新规则，文件名后缀.scss，与CSS语法相同查看全部
举报
0/150
提交
取消