Sass学习之路(10)——注释、数据类型

1.Sass的注释:

在说Sass的数据类型之前,先提一提Sass中注释的两种方式。

(1).类似CSS的注释方式,如: /*  这里是一段注释 */

(2).类似JavaScript的注释方式,如  //这里是一段注释

这两种方式都可以用来在Sass中注释,但是有一些区别。第一种方式,注释的内容也会在编译出的CSS中显示,而第二种不会显示。我们来看一个例子:

//定义一个占位符

%mt5 {
  margin-top: 5px;
}

/*调用一个占位符*/

.box {
  @extend %mt5;
}
上边的Sass编译后如下:

.box {
  margin-top: 5px;
}

/*调用一个占位符*/

2.Sass的数据类型:

Sass的数据类型和JavaScript还是很相似的,但是也具有自己独有的数据类型,这里来列举一下:

数字:  如1、2、13、10px;

字符串: 有引号字符串或无引号字符串,如“bar”、'nav'、tittle;

颜色: 如,blue,#04a3f9,rgba(255,0,0,0.5);

布尔值:如,true,false

空值:如,null

值列表: 用空格或者逗号将多个值分开, 如 2px 5px 、1px solid red;

tips:Sass中也支持一些其他的CSS属性值,如!important声明等。


这里提一下Sass的列表函数对值列表的一些操作:

1.nth函数:可以直接访问值列表中的某一项。

2.join函数:可以将多个值列表连接在一起

3.append函数:可以在值列表中添加值。

4.@each:能够给值列表中每个项目添加样式。


具体的写法和用法,会在后边的Sass函数的部分提及。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值