Sass基础--变量与导入
局部变量
body{ $color : red; color:$color; } footer{//footer里将访问不到$color变量,因为它是局部的 color:$color; }
全局变量
body{ $color : red !global; color:$color; } footer{//footer里将可以访问$color变量,因为它是全局的 color:$color; }
多值变量
$paddings : 5px 10px 5px 10px; body{ padding : $paddings; } //如果我们只想取一个值 如: padding-left : nth($paddings,1); //注意:索引是从1开始的不是从0.
- maps类型
$maps:( color:red , borderColor:blue ); body{ background:map-get($maps,color); border-color:map-get($maps,borderColor); }
部分文件
部分文件一般以'_'下划线开头 如:_part1.css
我们就可以导入或者引用这个部分文件,减少css的重复
//然后我们就可以导入文件了 @import "_part1.css"
下面三种情况被识别为css原生导入
: 被导入文件是以.css结尾
: 被导入文件是一个URL地址(如:http://xxx/xxx.css)
: 被导入文件的名字是CSS的url()值
//导入sass文件 _part1.scss @import "part1" //只用写文件名就可以了,然后就吧part1的内容写入当前文件中 //写'_'和后缀也行
相关推荐
nicepainkiller 2020-07-24
lanzhusiyu 2020-07-19
firefaith 2020-10-30
Erick 2020-11-17
xuebingnan 2020-11-05
Android开发CXY 2020-11-11
拉斯厄尔高福 2020-11-04
小飞侠V 2020-11-02
yutian0 2020-10-26
牧 2020-10-22
佐杰 2020-10-22
文山羊 2020-10-20
积少成多 2020-10-21
yuwinter 2020-10-14
Mars的自语 2020-09-27
Radar 2020-09-26
楼上小宇home 2020-09-26
Mynamezhuang 2020-09-18
归去来兮 2020-09-18