如何解决如何计算 SCSS 中百分比值的倍数?
问题:
我还有一个包含不同乘数 $multipliers : ('1','2','3','4')
的列表。
在 @each
中,我将遍历 $multipliers
中的所有项目,并且必须计算以下公式。
公式 => $length * $multiplier + 1
@each $multiplier in $multipliers {
.item-#{$multiplier} {
top: << FORMULA >>
}
}
问题:
有人可以帮助如何计算 SCSS 中包含百分比的最高值吗?
解决方法
您可以使用 SCSS @for
loop 来实现这一点。
$length: 12.5%;
@for $i from 1 through 4 {
.item-#{$i} {
top: ($i * $length);
}
}
它将生成此 CSS:
.item-1 {
top: 12.5%;
}
.item-2 {
top: 25%;
}
.item-3 {
top: 37.5%;
}
.item-4 {
top: 50%;
}
Example on CodePen。使用右上角的 CSS 下拉菜单“查看编译的 CSS”。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。