maomi
介绍
入门
文档

条件样式

媒体查询

与标准 CSS 不同,媒体查询需要写在 class 里面。

stylesheet! {
class my_class {
width = Px(600);
if media (max_width = Px(600)) and (min_width = Px(300)) {
width = auto;
}
}
}

使用 @support 进行特性检测也是类似的。

stylesheet! {
class my_class {
if supports (width = Vw(100)) {
width = Vw(100);
}
}
}

伪类

伪类也要写在 class 里面。

stylesheet! {
class my_class {
if hover {
text_decoration = underline;
}
}
}