Sass的乘法运算规则也适用于除法运算。不过除了除法运算还有一个特殊之处。众所周知“/”符号在css中已作为一种符号使用,因此在sass中做除法运算时,直接使用"/" 符号作为除号时,将不会生效,编译时既得不到我们需要的效果,也不会报错。一起先来看简单的示例:

这样的结果对于大家来说没有任何意义。要修正这个问题,只需要给运算的外面添加一个小括号( )即可:

除了上面情况带有小括号,“/”符号会当作除法运算符之外,如果“/”符号在已有的数学表达式中时,也会被认作除法符号。如下面示例:

另外,在 Sass 除法运算中,当用变量进行除法运算时,“/”符号也会自动被识别成除法,如下例所示:

综合上述,”/  ”符号被当作除法运算符时有以下几种情况:

•    如果数值或它的任意部分是存储在一个变量中或是函数的返回值。
•    如果数值被圆括号包围。
•    如果数值是另一个数学表达式的一部分。

如下所示:

Sass 的除法运算还有一个情况。我们先回忆一下,在乘法运算时,如果两个值带有相同单位时,做乘法运算时,出来的结果并不是我们需要的结果。但在除法运算时,如果两个值带有相同的单位值时,除法运算之后会得到一个不带单位的数值。如下所示:

Sass-除法的更多相关文章

  1. Sass的学习

    第一章:Sass简介 一. 什么是CSS预处理器 定义:CSS预处理器定义了一种新的语言,其基本思想是,用一种专门的编程语言,为CSS增加一些编程的特性,将CSS作为目标生成文件,然后开发者就只要使用 ...

  2. Sass入门:第四章

    1.加法 加法运算是Sass中运算的一种,在变量或属性中都可以做加法运算.如: .box { width: 20px + 8in; } 编译出来的CSS: .box { width: 788px; } ...

  3. 1-5 Sass的基本特性-运算

    [Sass运算]加法 程序中的运算是常见的一件事情,但在 CSS 中能做运算的,到目前为止仅有 calc() 函数可行.但在 Sass 中,运算只是其基本特性之一.在 Sass 中可以做各种数学计算, ...

  4. Sass 基础(四)

    当你想设置属性值的时候你可以使用字符串插入进来,另一个使用的用法是构建一个选择器. @mixin generate-sizes($class,$small,$medium,$big){ .#{$cla ...

  5. CSS预处理器(SASS和LESS)

    Sass框架应用Sass简介 Sass又名SCSS,是CSS预处理器之一,它能让你更好更轻松的工作.Sass官网是这样描述Sass的:**Sass是一门高于CSS的元语言,能用来清晰的.结构化地描述文 ...

  6. SCSS入门

    1. CSS预处理器 定义了一种新的专门的编程语言,编译后成正常的CSS文件.为CSS增加一些编程的特性,无需考虑浏览器的兼容问题,让CSS更加简洁,适应性更强,可读性更佳,更易于代码的维护等诸多好处 ...

  7. SCSS详解

    SCSS入门 CSS预处理器 定义了一种新的专门的编程语言,编译后成正常的CSS文件.为CSS增加一些编程的特性,无需考虑浏览器的兼容问题,让CSS更加简洁,适应性更强,可读性更佳,更易于代码的维护等 ...

  8. 再说scss

    1. CSS预处理器 定义了一种新的专门的编程语言,编译后成正常的CSS文件.为CSS增加一些编程的特性,无需考虑浏览器的兼容问题,让CSS更加简洁,适应性更强,可读性更佳,更易于代码的维护等诸多好处 ...

  9. vue入门文章

    本来想自己写一篇关于vue入门的文章.但是看到链接的文章后,觉得写得太详细了,实在有保存下来的必要.后面可能在这篇文章基础上,有所内容的增加. CSS预处理器 定义了一种新的专门的编程语言,编译后成正 ...

随机推荐

  1. OC中保存自定义类型对象的持久化方法

    OC中如果要将自定义类型的对象保存到文件中,必须进行以下三个条件: 想要把存放自定义类型的数组进行 持久化(就是将内存中的临时数据以文件<数据库等>的形式写到磁盘上)必须满足: 1. 自定 ...

  2. 31 October

    https://www.cnblogs.com/RabbitHu/p/51nod1353.html 树形 DP 求所有联通块 \(\ge K\) 的方案数. 切断:\(\forall i\in\lef ...

  3. js初步简单的编程代码

    简单图片切换编码demo图片地址自行替换 简单图片切换编码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...

  4. 2019牛客暑期多校训练营(第六场)C - Palindrome Mouse (回文自动机)

    https://ac.nowcoder.com/acm/contest/886/C 题意: 给出一个串A , 集合S里面为A串的回文字串 , 现在在集合S里面找出多少对(a,b),b为a的字串 分析: ...

  5. Docker 里面新建mysql 容器

    1.获取MySQL镜像, a.直接从docker hub 下载docker镜像 docker pull +镜像名称 b.从别的项目上把镜像export出来 dockr load  i + 镜像的TAR ...

  6. 622FThe Sum of the k-th Powers

    题目大意 求$\sum_{i=1}^{n} i^k$ 分析 我们发现这是一个$k+1$次多项式 因此我们求出前$k+2$项然后插值即可 由于$x_i = i$ 因此公式里面的乘机可以通过预处理然后循环 ...

  7. 知道css有个content属性吗?有什么作用?有什么应用?

    css的content属性专门应用在 before/after 伪元素上,用来插入生成内容.最常见的应用是利用伪类清除浮动. //一种常见利用伪类清除浮动的代码 .clearfix:after { c ...

  8. 使用python执行sql语句和外键解析

    一.下载并导入pymysql pip install pymysql && import pymysql db=pymysql.connect(host=) #如果报错host大概率因 ...

  9. [LeetCode] 4. Median of Two Sorted Arrays(想法题/求第k小的数)

    传送门 Description There are two sorted arrays nums1 and nums2 of size m and n respectively. Find the m ...

  10. Java thread(4)

    这一块主要是讨论关于进程同步的相关问题,主要是考虑一下的关键字:锁对象.条件对象 -> synchronized wait() notify(). 1.关于锁对象与条件对象: 所对象的定义在ja ...