跟JavaScript一样，Sass也有属于自己的数据类型。在Sass中，共有7种数据类型：
（1）数字值； （2）字符串； （3）布尔值； （4）颜色值； （5）列表值； （6）Map值； （7）空值null；接下来，我们在这一节详细介绍一下Sass种的7种数据类型。
一、数字值
在Sass中，数字（Number）是最基本的数据类型，可以是正数、0或负数。数字在Sass中使用非常广泛，大多数都是结合CSS单位来实现的，例如10px、10em或者10%。虽然它们带有单位，但是技术上依然算是数字。
举例：
$lineHeight:1.5;
$fontSize:14px;
$width:50%;
div
{
lineHeight:$lineHeight;
font-size:$fontSize;
width:$width;
}
编译出来的CSS代码如下：
div
{
line-height:1.5;
font-size:14px;
width:50%;
}
二、字符串
在JavaScript中，使用单引号（''）或双引号（""）包含的都是字符串，就算它们包含的是一个空格，那也是字符串。但是Sass中的字符串跟JavaScript中的字符串有点不一样。
在Sass中，共有2种字符串：
（1）有引号的字符串； （2）无引号的字符串；无引号字符串，我们在CSS中是经常遇到的，例如[font-weight:bold]中的bold、[font-family:sans-serif;]中的sans-serif等。Sass引入无引号字符串的目的也是为了与CSS语法一致。
举例：有引号字符串
$logoUrl: "images/logo.png";
$cursorUrl: "images/default.cur";
$text:"绿叶学习网";
div
{
background-image:url($logoUrl);
cursor:url($cursorUrl),default;
}
div:before
{
content:$text;
}
编译出来的CSS代码如下：
div
{
background-image:url("images/logo.png");
cursor:url("images/default.cur"),default;
}
div:before
{
content:"绿叶学习网";
}
举例：无引号字符串
$str1:sans-serif;
$str2:bold;
div
{
font-family:$str1;
font-weight:$str2;
}
编译出来的CSS代码如下：
div
{
font-family: sans-serif;
font-weight: bold;
}
三、布尔值
数字值和字符串这2种数据类型的取值有无数种，但是Sass中的布尔值只有2种取值：true和false。
在Sass中，布尔值一般用于[@if…@esle…语句]条件判断，只有条件表达式结果是false或null才会返回false，其他一切将返回true。
举例：无引号字符串
$a:10px;
$b:5px;
div
{
@if($a>$b)
{
display:block;
}
@else
{
display:none;
}
}
编译出来的CSS代码如下：
div
{
display:block;
}
分析：
Sass中的[@if...@else...]跟JavaScript中的[if...else...]是一样的，这个语句我们在后面[Sass @if语句]这一节中会详细介绍。
在这个例子中，($a>$b)返回的是true，所以div的display属性最终取值为block。
四、颜色值
在Sass，有一种特殊的数据类型，那就是[颜色值]。Sass中的颜色值共有4种：
（1）关键字颜色值，如red； （2）十六进制颜色值，如#FFFF00； （3）RGB颜色值，如rgb(255,255,0)； （4）HSL颜色值，如；hsl(360,50%,50%)；这几种颜色值都是可以互相转换的，在Sass的颜色运算中，我们都是统一转换为十六进制颜色值然后再计算。对于[Sass颜色运算]，我们在后面章节会详细介绍。
举例：
$fontColor:#FF00FF;
$bgColor:blue;
div
{
color:$fontColor;
background-color:$bgColor;
}
编译出来的CSS代码如下：
div
{
color: red;
background-color: #FF00FF;
}
五、列表值
在Sass中，为我们提供了一种[列表值]的数据类型，这种数据类型跟JavaScript中的数组是相似的，我们可以把它比作[Sass中的数组]。
Sass列表值有2种语法格式，一种是由英文逗号隔开的分隔值，另外一种是由空格隔开的分隔值。
语法：
$列表名: 值1 , 值2 , ... , 值n; $列表名: 值1 值2 ... 值n;
说明：
在Sass中，列表值可以包含0个、1个或多个值，甚至还可以包含多个[子列表值]。Sass中的列表值，往往都是用来处理CSS中类似于以下的属性取值：
margin:10px 20px 30px 40px; padding:10px 20px 30px 40px; font-family:Microsoft YaHei,Arial,Helvetica,sans-serif;
举例：
$font: Arial,Helvetica,sans-serif;
$margin:20px 40px;
$border:1px solid gray;
div
{
font:$font;
margin:$margin;
border:$border;
}
编译出来的CSS代码如下：
div
{
font: Arial, Helvetica, sans-serif;
margin: 20px 40px;
border: 1px solid gray;
}
分析：
对于列表值，Sass为我们提供了很多内置的函数，在后面[Sass列表函数]这一章我们会详细介绍。这里我们只需要简单认识一下就可以了。
六、Map值
在Sass中，还为我们提供了另外一种特殊数据类型：Map值。Map值跟JSON值是非常相似的，数据都是以[键/值]的方式成对出现。
语法：
$变量名:
(
键名1:值1,
键名2:值2,
……
键名n:值n
);
说明：
Map值的语法结构都是以[(]开始，到[)]结束的。其中[键名]和[值]之间用英文冒号构成对，两个[键名:值]之间用英文逗号分隔。此外还要注意一下，最后一对[键/值]后面是不需要逗号的。
举例：
$theme-color:
(
default:
(
bgcolor: #fff,
text-color: #444,
link-color: #39f
),
primary:
(
bgcolor: #000,
text-color:#fff,
link-color: #93f
),
negative:
(
bgcolor: #f36,
text-color: #fefefe,
link-color: #d4e
)
);
分析：
对于Map值，Sass为我们提供了很多内置的函数，在后面[Sass Map函数]这一章我们会详细介绍。这里小伙伴们不需要深入了解Map值，只需要简单认识一下就可以了。