小编Abd*_*ikh的帖子

在 mixin LESS 中将属性名称作为参数传递

我是新手。我正在尝试将 css 属性作为这样的参数传递

.border(@position:"left",@color: #ddd){
    border-@position :1px solid @color;   
}
Run Code Online (Sandbox Code Playgroud)

意味着每次我打字

.border(right,#efefef);
Run Code Online (Sandbox Code Playgroud)

它应该输出

border-right:1px solid #efefef;
Run Code Online (Sandbox Code Playgroud)

我正在使用 winless 编译代码 Winless version 1.8.3 和 LESS.js version 1.7.3

Winless 编译器报错

ParseError:在“行号等”行的“我的文件路径”中无法识别输入

在我寻找答案时,我发现这些问题大约 1 岁了,他们说这是不可能的(当时),因为 LESS 不支持它现在有可能吗?

如何在less中将属性名称作为参数传递给mixin

如果我使用这个,这个问题的答案使用了一个黑客来实现目标

.mixin(@prop, @value) {
    Ignore: ~"a;@{prop}:@{value}";
}
Run Code Online (Sandbox Code Playgroud)

发送属性作为 mixin 的参数

回答:

这里找到答案感谢其中的评论

这解决了问题 我几乎答对了

.border(@position:"left";@color:#ddd){
    border-@{position}:1px solid @color;
}
Run Code Online (Sandbox Code Playgroud)

可以使用

.border(right,#efefef)
Run Code Online (Sandbox Code Playgroud)

所以这编译为:

border-right: 1ps solid #efefef;
Run Code Online (Sandbox Code Playgroud)

在 LESS 中使用属性名称中的变量(动态属性/属性名称插值)

css less

3
推荐指数
1
解决办法
1972
查看次数

标签 统计

css ×1

less ×1