sass学习总结

SASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护。个人简单总结了下比较常用的的一些东西。

$ 开头定义变量名 是个全局变量   在{ $name } 局部变量

&代表父级 a{ &:hover{} } a{} a:hover{}

.a{ .b,.c,.d{} } .a .b,.a .c,.a ,d{} 群组

.a,.b{ a{}}  .a a,.b a{}   群组

.a{ border : { style:solid;1px;color:#ccc } }  属性嵌套 ‘:’ 必写

@at-root 在嵌套里标记用的 生成出来css是独立的 跳出嵌套

_aa.scss 一般为 局部文件 其实 @import 引入的时候 _可以不写

$aa:10 !default  !default设置默认值

@mixin 混合器 @include 调用 

布尔值  and(与)or(或) ot(非)

comparable($numver-1,$numver-2) 判断是否能相加 返回 布尔值 true/false

unit($numver) 判断 $numver 的单位

unitless($numver) 判断数值是否有单位 返回布尔值 没有单位是 true 反之 false

type-of($value) 返回类型 类似于js typeof

@function @return  必须要有返回值 

#{...} 插值

@for $i from 1 to 5  @for $i from 1 through 5 前者是到4不到5 后者循环到5 

@for $i from $strat through $end  开始结束如果是 strat 大就从小到大 反之亦然 

@if 判断条件{}@else{} 判断

@include a($a:10,$b:20) 可以传类似于json的值

原文地址:https://www.cnblogs.com/gua-gua/p/4658570.html