最后在github的issue中找到了方法，要想在sass的calc中使用变量，必须对这个变量使用sass的插值方法(#{$variable})。

所以把代码改正下面的形式就可以了：

 width: calc(100% - #{$topbar});

sass 使用clac的问题的更多相关文章

  1. wepack+sass+vue 入门教程（三）

    十一.安装sass文件转换为css需要的相关依赖包 npm install --save-dev sass-loader style-loader css-loader loader的作用是辅助web ...

  2. wepack+sass+vue 入门教程（二）

    六.新建webpack配置文件 webpack.config.js 文件整体框架内容如下,后续会详细说明每个配置项的配置 webpack.config.js直接放在项目demo目录下 module.e ...

  3. wepack+sass+vue 入门教程（一）

    一.安装node.js node.js是基础,必须先安装.而且最新版的node.js,已经集成了npm. 下载地址 node安装,一路按默认即可. 二.全局安装webpack npm install ...

  4. 前端CSS预处理器Sass

    前面的话   "CSS预处理器"(css preprocessor)的基本思想是,用一种专门的编程语言,进行网页样式设计,然后再编译成正常的CSS文件.SASS是一种CSS的开发工 ...

  5. SASS教程sass超详细教程

    SASS安装及使用(sass教程.详细教程) 采用SASS开发CSS,可以提高开发效率. SASS建立在Ruby的基础之上,所以得先安装Ruby. Ruby的安装: 安装 rubyinstaller- ...

  6. Sass之坑Compass编译报错

    前段时间在使用Compass时遇到了其为难处理的一个坑,现记录到博客希望能帮助到各位. 一.问题: 利用Koala或者是gulp编译提示如下,截图为koala编译提示错误: 二.解决办法 从问题截图上 ...

  7. emmet,jade,haml, slim,less,sass,coffeescript等的实战优缺点

    摘要: 文章背景,来自于群内周五晚上的一次头脑风暴式的思维碰撞交流活动. 随着前端技术的蓬勃发展, 各种新技术随着生产力的需要不断的涌入我们的视野, 那今天探讨的话题是这些新时代的前端兵器谱: 一. ...

  8. Sass用法指南

    写在前面的话:随着CSS文件越来越大,内容越来越复杂,对其进行很好的维护将变的很困难.这时CSS预处理器就能够帮上大忙了,它们往往拥有变量.嵌套.继承等许多CSS不具备的特性.有很多CSS预处理器,这 ...

  9. PostCSS深入学习: PostCSS和Sass、Stylus或LESS一起使用

    如果你喜欢使用PostCSS,但又不想抛弃你最喜欢的预处理器.不用担心,你不需要作出二选一的选择,你可以把PostCSS和预处理器(Sass.Stylus或LESS)结合起来使用. 有几个PostCS ...

随机推荐

  1. 前端（慕课网）笔记二：http协议

    缓存 cors 1.http协议的主要特点: 简单快速:每个资源URI是固定的: 灵活:通过一个协议完成不同数据格式的传输 无连接:连接一次就会断开,不会保持连接 无状态:客服端和服务端是两种身份,客 ...

  2. 20165205 2017-2018-2 《Java程序设计》第四周学习总结

    20165205 2017-2018-2 <Java程序设计>第四周学习总结 教材学习内容总结 相关概念: 继承:避免多个类间重复定义共同行为 子类与父类: 父类: 对有着共同特性的多类事 ...

  3. 关于Access导入Oracle会产生双引号的问题

    把Access2007的数据导入到oracle 10g xe中,成功了,可是在写sql语句时必须加双引号 ,如select “name” from “Product”,貌似是因为access为了防止列 ...

  4. uva-565-枚举

    16个披萨配料,选出一种组合满足所有人的需求,当然,如果某个人不喜欢A,结果里不包含A也是满足这个人的.只要答案满足题意既可,答案不唯一,special judge 用位枚举 #include < ...

  5. C++构造函数和析构函数执行顺序

    四种情况:1. 创建一个类指针时,调用其构造函数:删除当前指针时,自动调用其析构函数.2. 创建子类对象指针时,首先调用其父类的构造函数,然后调用子类的构造函数:删除当前指针时先调用子类的析构函数,然 ...

  6. 40. 数据泵导入导出impdp、expdp

    一.查看管理理员目录(同时查看操作系统是否存在,因为Oracle并不关心该目录是否存在,如果不存在,则出错)select * from dba_directories; 二.创建逻辑目录,该命令不会在 ...

  7. ubuntu下如何配置terminator(以16.04为例)（转载）

    https://blog.csdn.net/xungjhj/article/details/69377812 Terminator 常用快捷键 命令 说明 Ctrl+Shift+O 水平分割窗口 Ct ...

  8. Mysqli 数据库连接类

    <?php namespace Lib; // 数据库连接类 class DB { //私有的属性 private static $dbcon = false; private $host; p ...

  9. Dubbo 服务容错Hystrix

    一.服务者 1.pom <dependency> <groupId>org.springframework.cloud</groupId> <artifact ...

  10. jsfl 导出指定名称的swf

    var _openDOC = fl.openDocument("file:///E|TE/dt.fla"); var _exName = _openDOC.pathURI.spli ...