29sass

Posted zhongchao666

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了29sass相关的知识,希望对你有一定的参考价值。

SASS

一.SASS的作用: 方便编写CSS.
二.SASS依赖的环境 : Ruby
三.如何安装SASS?
gem install sass
gem update sass   (更新sass)
gem uninstall sass (删除sass)
四.如何测试sass是否安装成功? sass -v
五.如何编译sass?
1.考拉
2.gulp
六.sass有哪四种输出方式?
七.如何导入外部scss? @import "文件名";
八.sass嵌套? 如何引入父类? &
1. 选择器嵌套
2. 属性嵌套
3. 伪类嵌套
九.注释? //sass注释 /css注释/
十.SASS变量? $变量名 : 值;
1.普通引用变量 : $变量名       (值)
2.特殊引用变量: #{$变量名}   (属性)
十一.数组? $变量名 : 值1 值2 值3 ……;
十二.map? $变量名 : (key : value,key : value,……);
1. length();
2. map-get();
3. map-keys();
4.map-values();
5.map-has-key();
6.map-merge();
7.map-remove();
十三.选择?
@if 条件{
    执行语句
}@else if 条件{
    执行语句
}@else{
    执行语句
}
十四.循环?
@for $i from 1 through 5{
    
}
@for $i from 1 to 5{
    
}
区别?
十五[email protected]
@each $i in 数组{
    
}
十六.宏@mixin
@mixin 宏名 {
    内容
}

@mixin 宏名($变量 : 默认值){
    内容
}
导入宏:  @include
十七.函数
@function 函数名([参数]){
    @return 内容;
}
引用函数: 函数名([参数]);
十八.继承
@extend 选择器;

require

一.html页面中:
<script src=‘js/require.js‘ defer async=‘true‘ data-main=‘js/main‘>
二.配置主模块
1.配置依赖文件的路径
require.config({
    "paths" : {
        模块别名 : "模块路径", //不加扩展名
        ……
    }
})
2.引入依赖文件
require([模块别名,……],function(模块的返回值,……){
    编写代码
})
三.设置子模块
define(function(){
    return {
        子模块的功能
    }
})
四.

AMD : 依赖前置 (reqire.js)
CMD : 按需加载 (sea.js)


以上是关于29sass的主要内容,如果未能解决你的问题,请参考以下文章

29sass

关于SASS的一些碎碎念

为啥这个代码片段说包含错误?

刷新片段不再起作用?

如何使用 Android 片段?

使用 CSS3 动画和 Sass @for 循环触发列表