在Stylus mixin中连接变量

时间:2017-08-18 08:47:47

标签: css stylus

我正在尝试使用变量生成一些样式的mixin,我想连接两个变量,但我无法使其工作。这是一个例子:

centerSprite($icon)
    margin-top -(($ico_+$icon+_height) / 2)
    margin-left -(($ico_+$icon+_width) / 2)

我有一个带有图标高度和宽度的变量,我想把这个名字放在mixin的参数中以获取该变量并进行操作......

提前致谢!

2 个答案:

答案 0 :(得分:0)

我不知道为什么(也许是一个错误?)但是当你在函数内部的属性值中有一个减号括号时,手写笔无法编译:

此代码无法编译:

centerSprite()
    margin-top -((5 + 10 + 3) / 2)

body
    centerSprite()

但是没有函数的这个编译:

 body
     margin-top -((5 + 10 + 3) / 2)

我发现如果你在一个函数中也使用了冒号:

手写笔

centerSprite()
    margin-top: -((5 + 10 + 3) / 2)

body
    centerSprite()

<强> CSS

body {
    margin-top: -9;
}

答案 1 :(得分:0)

一位好人on Github向我解释了手写笔中的lookup内置功能,这就是我所寻求的:

$ico_test_width  ?= 20px
$ico_test_height ?= 15px

centerSprite($icon)
    margin-top : -(lookup('$ico_' + $icon + '_height') / 2)
    margin-left: -(lookup('$ico_' + $icon + '_width')  / 2)

body  
    centerSprite('test')