css - 每个循环中的 sass 变量插值
问题描述
试图在每个循环中使用变量。但似乎不适合我
$font-size-40: .5rem;
$font-size-50: .625rem;
$font-size-60: .75rem;
$fonts: 40 50 60;
@each $font in $fonts {
.font-size-#{$font} {
font-size: $font-size-#{$font};
}
}
解决方案
是这样弄的。它与键值方法一起工作正常。
$font-size-40: .5rem;
$font-size-50: .625rem;
$font-size-60: .75rem;
$fonts: (
'40': $font-size-40,
'50': $font-size-50,
'60': $font-size-60,
);
@each $font, $prop in $fonts {
.font-size-#{$font} {
font-size: #{$prop};
}
}
但仍然想知道为什么我们不能像这样使用它:- $font-size-#{$font}
推荐阅读
- python-3.x - OpenCV:从给定图像中分割每个数字。数字写在行矩阵的每个单元格中。每个单元格都以边距为界
- nginx - 如何使用 NGINX 正确设置多个站点?
- sql - 选择命令中的聚合函数与非聚合函数
- java - 如何修复 Layoutinflator not found 错误?
- powershell - 使用 PowerShell 执行调用批处理文件的远程脚本
- powershell - 通过 REST API 创建服务连接时无法加载私钥
- javascript - 如何在没有日志记录的情况下清除浏览器控制台?
- python - FactoryBoy - 嵌套工厂/最大深度?
- c++ - 如何在 C++ 中宏#define 静态方法调用?
- javascript - 尝试签署 jwt 会返回 undefined