热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

SASS错误:不兼容的单位:'px'和'px*px'

如何解决《SASS错误:不兼容的单位:'px'和'px*px'》经验,为你挑选了1个好方法。

我正在使用SCSS来改变bootstrap 4的样式来创建我自己的样式,但是当我编译我的SCSS时,我得到了这个错误:

{
  "status": 1,
  "file": "H:/!WEBSITE/modules/The Force - Bootstrap/content/scss/variables/variables.scss",
  "line": 330,
  "column": 34,
  "message": "Incompatible units: 'px' and 'px*px'.",
  "formatted": 
     "Error: Incompatible units: 'px' and 'px*px'. 
        on line 330 of scss/variables/variables.scss
        >> $input-height: (($font-size-base * $input-line-height) + ($input-padding-y * 2)) !default;"
}


我的变量值:

$font-size-base:          14px !default;
$line-height-base:        1.846 !default;
$input-line-height:       floor(($font-size-base * $line-height-base)) !default;
$input-padding-y:         6px !default;


弹出错误的行:

$input-height: (($font-size-base * $input-line-height) + ($input-padding-y * 2)) !default;


我不明白为什么它不起作用,我更了解如何解决它.我使用node-sass编译SCSS,我不认为问题来自node-sass,因为它不是我第一次使用它而且我整天都在使用它而没有出现任何类似的错误.



1> dippas..:

您的问题是,你是乘pxpx,导致px2

所以px从变量中 删除$font-size-base

$font-size-base:          14 !default;
$line-height-base:        1.846 !default;
$input-line-height:       floor(($font-size-base * $line-height-base)) !default;
$input-padding-y:         6px !default;
$input-height: (($font-size-base * $input-line-height) + ($input-padding-y * 2)) !default;

参见DEMO

上海社会科学院有关单位更多信息点击这里


推荐阅读
  • 从零基础到精通的前台学习路线
    随着互联网的发展,前台开发工程师成为市场上非常抢手的人才。本文介绍了从零基础到精通前台开发的学习路线,包括学习HTML、CSS、JavaScript等基础知识和常用工具的使用。通过循序渐进的学习,可以掌握前台开发的基本技能,并有能力找到一份月薪8000以上的工作。 ... [详细]
  • Bootstrap datetimepicker控件 日期时间选择器 简单使用
    bootstrap-datetimepicker日期控件简单使用应用场景:表单日期 ... [详细]
  • 这篇文章将为大家详细讲解有关C#开发技巧有哪些,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。C#开发技 ... [详细]
  • 本文介绍了前端人员必须知道的三个问题,即前端都做哪些事、前端都需要哪些技术,以及前端的发展阶段。初级阶段包括HTML、CSS、JavaScript和jQuery的基础知识。进阶阶段涵盖了面向对象编程、响应式设计、Ajax、HTML5等新兴技术。高级阶段包括架构基础、模块化开发、预编译和前沿规范等内容。此外,还介绍了一些后端服务,如Node.js。 ... [详细]
  • 媒介本文的前身是源自github上的项目awesome-github-vue,但由于该项目上次更新时候为2017年6月12日,许多内容早已逾期或是许多近期优异组件未被收录,所以小肆 ... [详细]
  • 前言:原本纠结于Web 模板,选了Handlebars。后来发现页面都是弱逻辑的,不支持复杂逻辑表达式。几乎要放弃之际,想起了Javascript中eval函数。虽然eval函 ... [详细]
  • Vue项目结构分析-项目结构重点在src文件夹:assets——静态资源,如css,jscomponents——公共组件router——路由文件(vuecli3.x没有自 ... [详细]
  • 开发笔记:sql盲注之报错注入(附自动化脚本)
    篇首语:本文由编程笔记#小编为大家整理,主要介绍了sql盲注之报错注入(附自动化脚本)相关的知识,希望对你有一定的参考价值。 ... [详细]
  • 《每个设计师都应该掌握的50个css代码段》11~20段
    2019独角兽企业重金招聘Python工程师标准11.胶卷边框img.polaroid{background:#000;*Changethistoabackgroundima ... [详细]
  • 序号funct ... [详细]
  • 本文介绍了响应式页面的概念和实现方式,包括针对不同终端制作特定页面和制作一个页面适应不同终端的显示。分析了两种实现方式的优缺点,提出了选择方案的建议。同时,对于响应式页面的需求和背景进行了讨论,解释了为什么需要响应式页面。 ... [详细]
  • OAuth2.0指南
    引言OAuth2.0是一种应用之间彼此访问数据的开源授权协议。比如,一个游戏应用可以访问Facebook的用户数据,或者一个基于地理的应用可以访问Foursquare的用户数据等。 ... [详细]
  • FontAwesome是一种webfont,它包含了几乎所有常用的图标,比如Twitter、facebook等等。用户可以自定义这些图标字体,包括大小、颜色、阴影效果以及其它可以通过CSS控制的属性。它有以下的优点:1、像矢量图形一样,可以无限放大2、只需一种字体,同时拥有多个图标,目前支持439个图标3、无需考虑兼容性问题,fontawesome不依赖于javascri ... [详细]
  • 前言:原本纠结于Web模板,选了Handlebars。后来发现页面都是弱逻辑的,不支持复杂逻辑表达式。几乎要放弃之际,想起了Javascript中ev ... [详细]
  • JavaScript和Python是用于构建各种应用程序的两种有影响力的编程语言。尽管JavaScript多年来一直是占主导地位的编程语言,但Python的迅猛发展有 ... [详细]
author-avatar
当个里个当
这个世界很大 大到我们错过了彼此 这个世界很小 小到每个细节都充满奇妙
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有