定义了一个 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. c# internal关键字

    对于一些大型的项目,通常由很多个DLL文件组成,引用了这些DLL,就能访问DLL里面的类和类里面的方法.比如,你写了一个记录日志的DLL,任何项目只要引用此DLL就能实现记录日志的功能,这个DLL文件 ...

  2. python 修改、读取图片元数据

    图片元数据 图片元数据(metadata)是嵌入到图片文件中的一些标签.比较像文件属性,但是种类繁多.常见的几种标准有: EXIF:通常被数码相机在拍摄照片时自动添加,比如相机型号.镜头.曝光.图片尺 ...

  3. C#面向对象 (访问修饰符、封装、继承、多态)

    先看一下创建一个新项目时的基本格式 using System; using System.Collections.Generic; using System.Linq; //引用的命名空间 using ...

  4. briup_JDBC

    连接mysql和orcle的驱动jar包 链接:https://pan.baidu.com/s/1M5RZY62UOZbfFGIwDQK6SQ  提取码:cu6e 复制这段内容后打开百度网盘手机App ...

  5. Linux环境下交叉编译器安装及运行

    描述: 由于 使用第三方编译器是提示No such file or directory 原因:编译器为32位版本,而系统是64位的 解决方法:安装32位版本编译支持库 sudo apt-get ins ...

  6. miguowangluozhan

    加紧备战 美国欲将全球拖入网络战争 人民日报 06-1405:01 去年,美国国防部发布的网络空间战略强调了“前沿防御(Defense forward)”理念.这被外界解读为美国军方将在他国而非美国本 ...

  7. 构建之法第二次作业【使用git和Vs实现四则运算】

    [相关信息] Q A GIT地址 git地址 GIT用户名 Lin-000 学号后五位 62501 博客地址 博客地址 作业链接 此次作业链接 1.项目需求 程序接收一个命令行参数 n,然后随机产生 ...

  8. SCU 4442 party 二分图最大点权独立集

    每个青蛙喝黑茶或者红茶或者都可以喝 M个矛盾关系 有矛盾的不能喝同种茶 但你可以花费Wi使得这个青蛙消除所有矛盾 把矛盾当作边 青蛙当作点 如果这两个青蛙只喝不同的一种茶就不建边 题目中保证了不存在奇 ...

  9. RocketMQ原理分析 文章 精选【收集】

    一. 推荐文章 1.以下来自OSChina的 mingxungu https://itzones.cn/ RocketMQ运维监控 RocketMQ刷盘策略 RocketMQ消息重试 RocketMQ ...

  10. File "/usr/bin/pip", line 11, in <module> sys.exit(__main__._main()) AttributeError: 'module' object has no attribute '_main'

    多个版本pip共存导致 直接使用pip2进行安装即可 如:pip2 install requests