For循环是在生成的CSS vars上添加一个空格。
For循环是在生成的CSS vars上添加一个空格。
提问于 2022-03-30 03:36:04
这一点就少了；
@sizes: xsmall, small, medium, medium-large, large, xlarge, xxlarge;
.init-spacing(@i) when (@i > 0) {
@size: extract(@sizes, @i);
// MARGINS --------------------------------------------
.margin-@{size} { margin: var(--spacing-@size); }
// PADDING --------------------------------------------
.padding-@{size} { padding: var(--spacing-@size); }
.init-spacing(@i - 1);
}
.init-spacing(length(@sizes));产生这一输出；
.margin-xxlarge {
margin: var(--spacing- xxlarge); <-- Notice the added space.
}
.padding-xxlarge {
padding: var(--spacing- xxlarge); <-- Notice the added space.
}
....我很好奇为什么css类名没有添加空间，但是它们在生成的css var中的用法确实有一个额外的空间。最重要的是，如何消除添加的空间，以便正确生成css vars？
下面是一个补补，它在编译后的css上显示问题。
回答 1
Stack Overflow用户
回答已采纳
发布于 2022-03-30 04:52:33
该空间是通过将@size连接到--spacing-@size来添加的，因为在变量之间添加的空间总是较少，例如@size@size的结果是xsmall xsmall。
若要删除不需要的空间，请使用~"--spacing-@{size}"
// MARGINS --------------------------------------------
.margin-@{size} { margin: var(~"--spacing-@{size}"); }
// PADDING --------------------------------------------
.padding-@{size} { padding: var(~"--spacing-@{size}"); }页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71671195
复制相关文章
相似问题
腾讯云开发者
