【问题标题】:SASS and simple Math (Addition) of two EM units [closed]两个 EM 单元的 SASS 和简单数学(加法)[关闭]
【发布时间】:2013-12-06 15:58:28
【问题描述】:

无论出于何种原因,我永远无法直接在 SASS 中获得简单的数学函数。我有一种情况,我想将两倍的装订线宽度添加到我已经在其他地方定义的宽度。两种宽度都在 EMS 中,但似乎我正在做的添加将它们视为字符串。以下是我尝试过的一些事情:

$width: 18.75em; /* 300px */
$grid-spacing: 2em; 

.column { margin-right: $width + $grid-spacing*2; }

.column { margin-right: 18.75em2em; } 中的结果

.column { margin-right: $width + ($grid-spacing*2); } 

.column { margin-right: 18.75em2em; } 中的结果

.column { margin-right: $width + #{$grid-spacing*2}; } 

.column { margin-right: 18.75em + 2em; } 中的结果

.column { margin-right: #{$width + #{$grid-spacing*2} }; 

.column { margin-right: 18.75em + 2em; } 中的结果

.column { margin-right: #{$width} + #{$grid-spacing*2}; }

.column { margin-right: 18.75em + 2em; } 中的结果

那么我在这里错过了什么? According to an issue on the SASS Github,在对它们进行数学运算之前,我不应该依赖从值中清除单位。我认为,问题在于+ 运算符用于连接和数学运算,这可能就是为什么我的值被视为字符串而不是可以加在一起的数字的原因。

想法?

【问题讨论】:

  • 我不能让这个失败,从命令行使用sass --scss,或者sassmeister.com。不管怎样,我最终得到margin-right: 22em; 我们能看到一小段 valid SCSS/SASS 失败了吗?当然,上面的示例无效,因为 margin-right 不在选择器内。
  • 这对我来说也符合预期。您使用的是旧版本的 SASS 吗?我也尝试过切换测试文件的字符编码,但还是没问题。
  • 嗯...我显然正在运行 SASS 3.2.6。命令是$ sass -v
  • “我认为,问题在于 + 运算符用于连接以及数学运算” + 视为加法。

标签: css sass compass-sass


【解决方案1】:

关于Sass ChangeLog,v3.2.8 修复了一些可能导致您的问题的问题。所以尝试更新你的 Sass 版本:

gem install sass

如果您sass -v 时没有为您提供 3.2.12 版本,则卸载并重新安装 Sass:

sudo gem uninstall -Iax sass
sudo gem install sass --pre

您的示例运行良好,并编译为:

.column {
  margin-right: 22.75em;
}

示例:http://sassmeister.com/gist/7780591

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2022-01-21
    • 2012-03-11
    • 2014-12-25
    • 2013-02-11
    • 2013-06-15
    • 2017-06-17
    • 2014-10-08
    • 1970-01-01
    相关资源
    最近更新 更多