Filtering inside a stylus selector
-
12-11-2019 - |
题
I have several .list
elements which all need a red color. Of these .list
elements, the ones with class .foo
would need a bigger font, whereas .bar
would need a smaller font.
In CSS, it would be along the lines of:
.list {
color: red;
}
.list.foo {
font-size: 150%;
}
.list.bar {
font-size: 75%;
}
Is there a way in Stylus to get this without using .list
thrice? I know this works:
.list
color red
.list.foo
font-size 150%
.list.bar
font-size 75%
I would like something like the following instead, so as to make it clearer everything belongs to .list
elements, with certain constraints (.foo
, .bar
) added for specific properties. The following, however, selects descendants instead:
.list
color red
.foo
font-size 150%
.bar
font-size 75%
Is there a syntax in Stylus that allows this kind of structure, i.e. to filter elements inside .list
, and apply certain properties to each "branch" (.list.foo
, .list.bar
)?
没有正确的解决方案
不隶属于 StackOverflow