stylus之变量(Variables)
阅读原文时间:2021年04月20日阅读:1

变量(Variables):

变量:

我们可以指定表达式为变量,然后在我们的样式中贯穿使用

编译为

变量甚至可以组成一个表达式列表

标识符(变量名,函数等),也可能包括$字符

属性查找:

Stylus有另外一个很酷的独特功能,不需要分配值给变量就可以定义引用属性。下面是个很好的例子,元素水平垂直居中对齐(典型的方法是使用百分比和margin负值)

我们不使用这里的变量w和h, 而是简单地前置@字符在属性名前来访问该属性名对应的值

另外使用案例是基于其他属性有条件地定义属性。在下面这个例子中,我们默认指定z-index值为1,但是,只有在z-index之前未指定的时候才这样

这里”logo”因为已经设置了z-index属性,所以通过unless关键字确定最后的z-index的值是20,但是”logo2”因为没有定义z-index的属性,所以最终的值是1

属性会“向上冒泡”查找堆栈直到被发现,或者返回null(如果属性搞不定)。下面这个例子,@color被弄成了blue

手机扫一扫

移动阅读更方便

阿里云服务器
腾讯云服务器
七牛云服务器

你可能感兴趣的文章