你可以在Stylus中将任何代码块赋值给一个变量，然后调用它，作为参数传递，或者以任何其他方式重用它。
要定义一个block，可以在赋值符号后增加缩进:
foo =
width: 20px
height: 20px
或者使用@block关键字的花括号语法:
foo = @block {
width: 20px
height: 20px
}
如果你想在任何地方渲染这个块，你可以在插值函数中调用这个变量
.icon
{foo}
将呈现
.icon {
width: 20px;
height: 20px;
}
顺便说一下，这是同样的方式，你可以使用块传递给块mixins。
现在你只能将变量作为任何其他变量传递，并在插值内渲染它。在未来，我们将提供更多的处理方式。
@BLOCK 你可以在Stylus中将任何代码块赋值给一个变量，然后调用它，作为参数传递，或者以任何其他方式重用它...
简介 css预处理器有Less、Sass（Scss）及Stylus；它们各自的背景如下: Sass：2007年诞生...
概述 什么是Stylus Stylus是一个CSS预处理器。 什么是CSS预处理器 关于CSS预处理器，推荐先行阅...
@KEYFRAMES Stylus支持@keyframes和花括号或没有花括号，你也可以在@keyframes的名...
@EXTEND Stylus @extend指令的灵感来自于(本质上是一样的)SASS实现，只有很少的细微差别。该...
哈希（HASHES） Stylus 在 0.39.0 版本中增加了对哈希对象的支持。 定义 可以使用大括号来定义哈...
注释 Stylus 支持三种注释方式：单行注释、多行注释和多行缓冲注释。 单行注释 单行注释和 JavaScrip...
@MEDIA @media 查询的工作原理和常规 CSS 中的完全一致，但是需要使用 Stylus 的代码块表示法...
URL() 数据图像URL内联 Stylus与一个名为url()的可选函数绑定在一起，该函数替换了文本url()调...
常见CSS预处理器：Less / SASS / Stylus等。 Less预处理器：使用CSS语法，可以做一些逻辑...
本文标题：Stylus预处理器简介(十九)@BLOCK
本文链接：https://www.haomeiwen.com/subject/hzwmmltx.html
网友评论