发表于: 2019-03-22 21:11:06

1 742


今天完成的事情:

今天把sass配置好了,又把任务11做完了

明天计划的事情:明天计划11点到家,哈哈。有时间的话把任务八重新做一遍
遇到的问题:sass变量

sass变量的格式:

sass变量格式:$var:value; 栗子:$color:red;

1.必须是$开头

解析:这是sass变量的符号

2.$后面紧跟变量名

解析:变量名首字母必须为字母(a-z A-Z),下划线(_)开头。

3.变量的值

解析:变量值和变量名之间就需要使用冒号(:)分隔开(就像CSS属性设置一样)。

sass变量的用法:

$color:red;/*1.这就是声明变量*/ 

p{color:$color;}/*P标签的颜色被改为red————这是变量的使用*/ 

1.变量使用之前要先声明变量

解析:声明在变量这个盒子里面要放什么东西,那里面就有东西了

2.第二步使用变量。

解析:现在变量里面有东西了,要把里面的东西拿出来用,就要先找到变量这个盒子,找到盒子才能使用里面的东西。变量的变量名,就是这个盒子在的地方,把他放在你所要用的地方,就是把盒子里面的东西取出来用了。

多值变量:

多值变量格式: 

$var:value,value,value;

实例: 

““ 

$back:#fff,green,red;/1.多个变量一起声明/ 

p{ 

color: nth($back,1);/2.输出green/ 

span{ 

color: nth($back,3);/3.输出red/

““

解析:

所谓的多值变量就是字面上的意思,把多个相关的值写在一个变量里,然后通过nth($var,index)来获取第几个值。通常可以用于在写页面的时候声明多个颜色,然后再样式里面直接使用就可以了。

收获:了解了sass嵌套的用法


返回列表 返回列表
评论

    分享到