5

是否可以在单个 sass 断点内设置一次变量的值,而不是每次使用该变量时?

换句话说,我想这样做:

$tab: 600px;
$wp: 100%;

@include breakpoint($tab) {
    $wp: 95%;
}

.alpha {
    // ...
    width: $wp;
}

.beta {
    // ...
    width: $wp;
}

.gamma {
    // ...
    width: $wp;
}

...而不是这样:

$tab: 600px;
$wp: 100%;
$wp-tab: 95%;

.alpha {
    // ...
    width: $wp;
    @include breakpoint($tab) {
        width: $wp-tab;
    }
}

.beta {
    // ...
    width: $wp;
    @include breakpoint($tab) {
        width: $wp-tab;
    }
}

.gamma {
    // ...
    width: $wp;
    @include breakpoint($tab) {
        width: $wp-tab;
    }
}

我认为第一种方法不会按原样工作。有没有其他方法可以达到同样的效果?这种方法是一个坏主意吗?

4

1 回答 1

5

这是不可能的。

引用Sass 的开发者nex3的话:

虽然这会很酷,但它与 Sass 样式表的现有语义大相径庭。您概述的内容已经具有含义:它按顺序设置变量两次,然后访问它(以一些范围问题为模)。Sass 的顺序性和基本命令性意味着您所描述的那种自动复制规则变得非常复杂。我们实际上考虑了一些非常相似的处理 SassScript & 的方法,最终意识到实际上不可能这样做并保留现有的语义。

您现在可以做的最好的近似是将需要变化的样式与参数放在一个 mixin 中,并将其包含在您的媒体查询中。

来源:https ://github.com/nex3/sass/issues/1227

于 2014-05-29T17:14:06.127 回答