[英]SCSS: Assigning two values to a variable
I am using this mixin to generate media queries. 我正在使用这个mixin来生成媒体查询。 The mixin works by inserting two values (a min width and an optional max width):
mixin通过插入两个值(最小宽度和可选的最大宽度)来工作:
@include respond-to(300px,500px) {
.this-is-not-in-ie-either { color: green; }
}
The trouble is that max/min width values are difficult to remember. 麻烦的是,最大/最小宽度值难以记住。 I would much rather insert a key word variable.
我宁愿插入关键字变量。
Eg 例如
$mob: 0, 480px;
$tab: 480px, 940px;
However, SCSS misunderstands this as the min width being "0, 480px" and the max-width being "undefined". 但是,SCSS误解了这一点,因为最小宽度为“0,480px”,最大宽度为“未定义”。
Is it possible to have a variable which holds two values. 是否可以有一个包含两个值的变量。
I know I could use two key words (eg $mob-min, $mob-max), but I would rather just use one. 我知道我可以使用两个关键词(例如$ mob-min,$ mob-max),但我宁愿只使用一个。
When you write this: 当你写这个:
$mob: 0, 480px;
@include respond-to($mob) {
.this-is-not-in-ie-either { color: green; }
}
What you're actually doing is passing the list as the first argument to the mixin: 你实际做的是将列表作为第一个参数传递给mixin:
@include respond-to($mixins-first-arg: (300px,500px)) {
.this-is-not-in-ie-either { color: green; }
}
What you need to write is this: 你需要写的是:
@include respond-to($mob...) {
.this-is-not-in-ie-either { color: green; }
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.