我有一个 sass map
看起来像这样:
$settings: ("offset": 'margin-left',
"push": 'left',
"pull": 'right',
"center": 'margin-left');
在下面,我有一个从 1
循环到值为 12
的特定变量的函数。
@for $index from 1 to 12 {
@each $type, $property in $settings {
&.#{$type}-#{$index} {
@include someFunctionDoesntMatter($property, $index);
}
}
}
如您所见,我已经从那个 sass map
中选择了数据,但不是特定的数据,我只是循环所有数据。
我如何选择 map 中包含值的第 4
项?
我已经在循环的最后一个括号下尝试了这段代码:
&.#{nth($settings, 4)} {
...
}
但这给了我这个错误:
cmd.exe /D /C C:/Ruby200-x64/bin/scss.bat --no-cache --update main.scss:main.css
error features\grid\_grid-extensions.scss (Line 19: Invalid CSS after "&.": expected class name, was ""center" "margi...")
Process finished with exit code 1
最佳答案
nth($settings, 4)
将返回键值对,而不是您可以用来构建选择器的值。
你可以这样做:
$settings: ("offset": 'margin-left',
"push": 'left',
"pull": 'right',
"center": 'margin-left');
div {
&.#{nth(nth($settings, 4), 1)} {
content: nth(nth($settings, 4), 2);
}
}
这将呈现:
div.center {
content: "margin-left";
}
关于css - 在 sass 映射中选择具有值的特定元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24166331/