定义了一个 px 转 rem 的函数

@function remP($px) {
@return $px / (750 / 15) * 1rem;
}

在使用 calc 的时候想要使用函数求值的时候遇到了需要使用插值语句来完成的情况

    .content {
height: calc(100vh - #{remP(100)});
}

这里不能直接使用 remP(100),需要使用 #{} 差值语句将变量函数等求值才行

sass 插值语句的使用的更多相关文章

  1. Sass插值、注释、数剧类型、字符串、值类型

    插值#{}使用 CSS 预处理器语言的一个主要原因是想使用 Sass 获得一个更好的结构体系.比如说你想写更干净的.高效的和面向对象的 CSS.Sass 中的插值(Interpolation)就是重要 ...

  2. 你需要知道的Sass插值

    你也许会不时地写写 Sass 玩玩,你也会很享受它带给你各种便利.但还有一件事,你并不一定完全了解:插值 (interpolation) - 将一个占位符,替换成一个值.好了,你们都很幸运,因为今天我 ...

  3. sass判断语句

    @if判断 @if可一个条件单独使用,也可以和@else结合多条件使用 scss.style css.style 三目判断 语法为:if($condition, $if_true, $if_false ...

  4. MySQL插值语句

    insert into Daywork( fdayworkId, fuserId, fdate, fhours, fclaimdate ) values ( 2709, '1@2.3', '2013- ...

  5. Sass的学习

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

  6. Sass入门:第三章

    1.声明变量 Sass声明变量以美元符号"$"开头.例如: $width : 300px; 上面的例子中,Sass的变量包括三个部分: (1)声明变量的符号"$" ...

  7. Sass学习第一天

    Sass学习 网站学习地址: Sass中文网:https://www.sass.hk/docs/#t7-3 Airen的博客:https://www.w3cplus.com/preprocessor/ ...

  8. css预编译语言 sass scss(变量$var, css嵌套规则,@import规则,@extend,@mixin)

    什么是sass Sass 是对 CSS 的扩展,让 CSS 语言更强大.优雅. 它允许你使用变量.嵌套规则. mixins.导入等众多功能, 并且完全兼容 CSS 语法. Sass 有助于保持大型样式 ...

  9. sass的多种用法

    sass的多种用法 主要归纳总结sass的常见用法,作为个人笔记使用,部分知识点并不仔细讲解.具体可参考文档:sass官网 一.嵌套 .svg{ position: absolute; left: 0 ...

随机推荐

  1. Socket的神秘面纱

    Tcp/IP协议是目前世界上使用最为广泛的协议,是以Tcp/IP为基础多个层次上的协议的集合.也称Tcp/IP协议族或Tcp/IP协议栈. TCP: Transmission Control Prot ...

  2. TypeScript入门四:TypeScript的类(class)

    TypeScript类的基本使用(修饰符) TypeScript类的抽象类(abstract) TypeScript类的高级技巧 一.TypeScript类的基本使用(修饰符) TypeScript的 ...

  3. mybatis+Oracle 批量插入数据,有数据做更新操作

    <!-- 批量添加 -->     <insert id="batchAdd" parameterType="java.util.List"& ...

  4. SQL学习——LIKE运算符

    原文链接 LIKE 作用 在WHERE子句中使用LIKE运算符来搜索列中的指定模式. 有两个通配符与LIKE运算符一起使用: % - 百分号表示零个,一个或多个字符 _ - 下划线表示单个字符 注意: ...

  5. 【Java并发】基础

    一.概述 1.1 线程与进程区别 1.2 多线程引发的性能问题 二.多线程创建方式 2.1 第一种-继承Thread类 2.2 第二种-实现Runnable接口 2.3 第三种-实现Callable接 ...

  6. ST3 C程序自动补全

    参考: http://www.cnblogs.com/heleifz/p/3404600.html http://www.cnblogs.com/By-ruoyu/p/4687196.html htt ...

  7. $(selector).each() 和$each() 的区别

    今天在做项目的时候, 后台数据需要循环遍历出来, 想到each,    结果,竟然不记得语法了 现在来回顾一下,而搜索了一下,竟然发现有两种each  一种就是$(selector).each()  ...

  8. web开发:javascript动画

    一.鼠标事件 二.js盒模型 三.鼠标拖拽 四.键盘事件 五.其他时间应用 六.定时器 七.定时器案例 八.随机数 一.鼠标事件 <!DOCTYPE html> <html> ...

  9. mysql5.7安装中的问题(服务无法启动。服务没有报告任何错误。排查方法)

    1.拒绝访问的问题 权限不够,必须以管理员身份启动命令行 2.MySQL 服务无法启动.服务没有报告任何错误. 进入到你的mysql安装目录,C:\Program Files\MySQL\MySQL ...

  10. 如何实现swipe、tap、longTap等自定义事件

    前言 移动端原生支持touchstart.touchmove.touchend等事件,但是在平常业务中我们经常需要使用swipe.tap.doubleTap.longTap等事件去实现想要的效果,对于 ...