其它 @ 规则
Stylus 对 CSS 的大多数无括号语法的 @ 规则提供了基本的支持,例如 @viewport
、@page
、@host
、@supports
等等:
@viewport
color: #00f
@supports (display: flex)
div
display: flex
@page :blank
@top-center
content: none
编译为:
@viewport {
color: #00f;
}
@supports (display: flex) {
div {
display: flex;
}
}
@page :blank {
@top-center {
content: none;
}
}
未知的 @ 规则
Stylus支持任何未知的 @ 规则,此它具有向前兼容性,因为 CSS 中的任何新 @ 规则都可以用 Stylus 基于缩进的语法编写,并且可以完美呈现:
@foo
@bar
width: 10px
.baz
height: 10px
编译为:
@foo {
@bar {
width: 10px;
.baz {
height: 10px;
}
}
}