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

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

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

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

综合上述,”/ ”符号被当作除法运算符时有以下几种情况:
• 如果数值或它的任意部分是存储在一个变量中或是函数的返回值。
• 如果数值被圆括号包围。
• 如果数值是另一个数学表达式的一部分。
如下所示:

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

Sass-除法的更多相关文章
- Sass的学习
第一章:Sass简介 一. 什么是CSS预处理器 定义:CSS预处理器定义了一种新的语言,其基本思想是,用一种专门的编程语言,为CSS增加一些编程的特性,将CSS作为目标生成文件,然后开发者就只要使用 ...
- Sass入门:第四章
1.加法 加法运算是Sass中运算的一种,在变量或属性中都可以做加法运算.如: .box { width: 20px + 8in; } 编译出来的CSS: .box { width: 788px; } ...
- 1-5 Sass的基本特性-运算
[Sass运算]加法 程序中的运算是常见的一件事情,但在 CSS 中能做运算的,到目前为止仅有 calc() 函数可行.但在 Sass 中,运算只是其基本特性之一.在 Sass 中可以做各种数学计算, ...
- Sass 基础(四)
当你想设置属性值的时候你可以使用字符串插入进来,另一个使用的用法是构建一个选择器. @mixin generate-sizes($class,$small,$medium,$big){ .#{$cla ...
- CSS预处理器(SASS和LESS)
Sass框架应用Sass简介 Sass又名SCSS,是CSS预处理器之一,它能让你更好更轻松的工作.Sass官网是这样描述Sass的:**Sass是一门高于CSS的元语言,能用来清晰的.结构化地描述文 ...
- SCSS入门
1. CSS预处理器 定义了一种新的专门的编程语言,编译后成正常的CSS文件.为CSS增加一些编程的特性,无需考虑浏览器的兼容问题,让CSS更加简洁,适应性更强,可读性更佳,更易于代码的维护等诸多好处 ...
- SCSS详解
SCSS入门 CSS预处理器 定义了一种新的专门的编程语言,编译后成正常的CSS文件.为CSS增加一些编程的特性,无需考虑浏览器的兼容问题,让CSS更加简洁,适应性更强,可读性更佳,更易于代码的维护等 ...
- 再说scss
1. CSS预处理器 定义了一种新的专门的编程语言,编译后成正常的CSS文件.为CSS增加一些编程的特性,无需考虑浏览器的兼容问题,让CSS更加简洁,适应性更强,可读性更佳,更易于代码的维护等诸多好处 ...
- vue入门文章
本来想自己写一篇关于vue入门的文章.但是看到链接的文章后,觉得写得太详细了,实在有保存下来的必要.后面可能在这篇文章基础上,有所内容的增加. CSS预处理器 定义了一种新的专门的编程语言,编译后成正 ...
随机推荐
- OC + RAC (九) 过滤
// 跳跃 : 如下,skip传入2 跳过前面两个值 // 实际用处: 在实际开发中比如 后台返回的数据前面几个没用,我们想跳跃过去,便可以用skip - (void)skip { RACSubjec ...
- Python全栈开发,Day1
一.Python介绍及版本 Python崇尚优美.清晰.简单,是一个优秀并广泛使用的语言. 目前Python主要应用领域: 云计算:云计算最火的语言 WEB开发:众多优秀的WEB框架,众多大型网站均为 ...
- 【HDOJ6616】Divide the Stones(构造)
题意:给定n堆石子,第i堆的个数为i,要求构造出一种方案将其分成k堆,使得这k堆每堆数量之和相等且堆数相等 保证k是n的一个约数 n<=1e5 思路:先把非法的情况判掉 n/k为偶数的方法及其简 ...
- Cookie和Session的区别和联系
会话技术 1.Cookie 客户端会话技术 数据存储在客户端,只能存String类型,并且大小有限制,一般为4KB,Cookie数量有限制(20个),不同浏览器不同: 一个Tomcat服务器中的共享问 ...
- JS replace方法
var str = '1abc2defg3hijk'; str.replace(/\d/g,function(a,b,c,d){ console.log("a:",a);// 匹配 ...
- python中的变量的学习
今年以来,时间都安排在学习python语言上了.(python3) 从最基础的变量开始学习.尽管以前学习过一段时间,但这次是系统性的学习,所以多花点时间,重新开始.学习完基础知识后,多练习几个项目. ...
- python内置装饰器
前言 接着上一篇笔记,我们来看看内置装饰器property.staticmethod.classmethod 一.property装饰器 1. 普通方式修改属性值 code class Celsius ...
- Fedora 26 安装搜狗拼音输入法 sogoupinyin
Fcitx 官方 wiki Fcitx GitHub Arch wiki 上关于 Fcitx 的资料 故障排除可以参考这里 Fedora 中文社区 Fedora 中文社区软件源 Fcitx (Flex ...
- 16/7/9_Bootstrap-设计原则
移动优先: • 在设计的初期就要考虑页面如何在多终端展示 渐进增强: • 充分发挥硬件设备的最大功能
- 04 | 基础篇:经常说的 CPU 上下文切换是什么意思?(下)
上一节,我给你讲了 CPU 上下文切换的工作原理.简单回顾一下,CPU 上下文切换是保证 Linux 系统正常工作的一个核心功能,按照不同场景,可以分为进程上下文切换.线程上下文切换和中断上下文切换. ...