css - 如何在 SASS/SCSS 列表变量中为表单字段使用属性选择器？

Question

例子:

$list: (
    input[type="text"],
    input[type="name"],
    input[type="email"],
    textarea,
    select[multiple]
) !default;

@each $value in $list {
    #{nth($value, 1)} {
        // Stuff
    }
}

错误(使用 Gulp 构建):

Invalid CSS after "    input": expected expression (e.g. 1px, bold), was '[type="text"],'

像这样转义 [ ] input\[type="text"\] 输出没有错误但不起作用。

Answer 1

用引号包裹条目:

$list: (
    'input[type="text"]',
    'input[type="name"]',
    'input[type="email"]',
    'textarea',
    'select[multiple]'
) !default;