时间戳

首页 > 解决方案 > SASS - 由连接字符串和变量形成的新映射键

css - SASS - 由连接字符串和变量形成的新映射键

问题描述

假设一个彩色图：

$palette: (
    colour1: #d70,
    ...
)

我想遍历地图并将一些新条目合并到地图中 - 使用从旧键派生的新键名，但-hover附加了新值作为派生的颜色的低 alpha 版本。这是我坚持的关键名称部分。

期望的结果：

$palette: (
    colour1: #d70,
    colour1-hover: (a low-alpha version of #d70)
)

我试过了：

@each $key, $val in $palette {
    $newKey = {$key}-hover;
    $palette: map-merge($palette, ($newKey: rgba($val, .13)));
}

...灵感来自创建动态类名时显示的语法，但这似乎是无效的语法。

有没有办法我可以做到这一点？

标签： csssass

解决方案

推荐阅读