本节我们来看一下 Sass 中的数字函数，就像字符串函数主要用于字符串，Sass 中的数字函数主要用于处理数值。
常用的数字函数：
| abs() | 返回一个数值的绝对值 |
| ceil() | 向上取整 |
| floor() | 向下取整 |
| comparable() | 返回一个布尔值，判断两个参数是否可以比较 |
| max() | 返回最大值 |
| min() | 返回最小值 |
| percentage() | 将数字转化为百分比的表达形式 |
| random() | 返回 0-1 区间内的小数 |
| round() | 返回最接近该数的一个整数，四舍五入 |
abs()函数
abs() 函数用于返回一个数值的绝对值，这个其实很好理解，数学里面我们也有学过绝对值，我们来看一下这个函数的使用。
示例：
.func {
font-size: abs(-14px);
padding: abs(10px);
}
编译成 CSS 代码：
.func {
font-size: 14px;
padding: 10px;
}
ceil()函数
ceil() 函数用于小数的向上取整，不用遵循四舍五入，例如 3.1 向上取整为 4。
示例：
.func {
width: ceil(10.1px);
height: ceil(10.9px);
}
编译成 CSS 代码：
.func {
width: 11px;
height: 11px;
}
floor()函数
floor() 函数的使用和 ceil() 函数差不多，但是 floor() 是用于向下取整。
示例：
.func {
width: floor(5.1px);
height:floor(5.9px);
}
编译成 CSS 代码：
.func {
width: 5px;
height: 5px;
}
comparable()函数
comparable() 函数判断两个参数是否可以进行比较，结果返回一个布尔值，如果可以进行比较则返回 true，否则返回 false。
示例：
.func {
content1: comparable(10px, 20px);
content2: comparable(10px, 20em);
content3: comparable(10px, 20);
}
编译成 CSS 代码：
.func {
content1: true;
content2: false;
content3: true;
}
从编译后的 CSS 代码可以看出，不同单位的数值是不可以进行比较的，会返回 false。
max()/min()函数
max() 函数用于返回最大值，min() 函数用于返回最小值。
示例：
.max{
content: max(1, 2, 10, 21, -19);
}
.min{
content: min(1, 2, 10, 21, -19);
}
编译成 CSS 代码：
.max{
content: -19;
}
.min{
content: 21;
}
percentage() 函数
percentage() 函数用于将数字转化为百分比的表达形式。
示例：
.num{
per1: percentage(28);
per2: percentage(0.1);
}
编译成 CSS 代码：
.num {
per1: 2800%;
per2: 10%;
}
random() 函数
random() 函数用于返回 0到1 区间内的小数 。当函数中带有一个参数 number 时，返回 1 至 number 之间的整数，包括 1 和 limit。
示例：
例如获取 0 到 1 之间的五个随机数，可以使用 Sass 中的循环语句来实现：
@for $i from 1 through 5{
.num#{$i} {
width: random();
}
}
编译成 CSS 代码：
.num1 {
width: 0.9782531648;
}
.num2 {
width: 0.7659667301;
}
.num3 {
width: 0.5846525783;
}
.num4 {
width: 0.954587481;
}
.num5 {
width: 0.7133921463;
}
如果我们想获取某个范围内的随机整数，可以在 random() 函数中指定一个参数。
示例：
例如生成1到10之间的一个随机数：
.num{
width: random(10);
}
编译后的 CSS 代码：
.num {
width: 7;
}
可以看到在编译后的 CSS 代码中，生成的随机数为 7。如果我们再次执行编译命令，则又会重新生成一个随机数。
round()函数
round() 函数用于返回最接近该数的一个整数，四舍五入。这个函数也是用于小数的取整，但是和 ceil() 函数不同，它遵循四舍五入。四舍五入我们小时候在数学中就学过啦，大家应该都知道。
示例：
.num{
width: round(10.4px);
height: round(39.6px);
}
编译后的 CSS 代码：
.num {
width: 10px;
height: 40px;
}