在SCSS中，如何引用外部作用域/块中的值？

Question

以下是SCSS中的代码段：

#import

可以看出，如果满足媒体查询#include。属性.element-a { position: absolute; right: 0; width: 216px; height: 232px; @media (max-width: 1000px) { right: 0; // Half of 0 width: 118px; // Half of 216 px height: 116px; // Half of 232 px } } .element-b { position: absolute; width: 140px; height: 152px; right: 216px + 10px; @media (max-width: 1000px) { width: 70px; // Half of 140px height: 76px; // Half of 152px right: 113px; // Half of 226px } } ，max-width:1000px和right应为其原始值的一半。但是，通过手动计算值来硬编码值看起来不太好。

有没有更好的方法在SASS / SCSS中写这个？或者有没有办法在外部范围内引用该值？

Answer 1

使用variables，这是一个例子：

$b-width: 140px;

.element-b {
    width: $b-width;
    @media (max-width: 1000px) {
        width: $b-width/2 // Half of $b-width
    }
}