I guess you're looking for this
Here's a simple example
.a
color: red
.b
width: 100px
.c
@extend .a, .b
height: 200px
which outputs
.a,
.c {
color: #f00;
}
.b,
.c {
width: 100px;
}
.c {
height: 200px;
}
문제
Assume that we have the following in LESS:
.large-heading {
font-family:Helvetica, Arial, sans-serif;
font-weight:bold;
font-size:24px;
text-transform:uppercase;
line-height:1.2em;
color:#ccc;
}
.med-heading {
.large-heading;
font-size:18px;
}
which perfectly works. I want to have the same effect, don't repeat the attributes of the fist to the second using Stylus. How can I achieve that? I tried the previous on Stylus and it doesn't work.
해결책
I guess you're looking for this
Here's a simple example
.a
color: red
.b
width: 100px
.c
@extend .a, .b
height: 200px
which outputs
.a,
.c {
color: #f00;
}
.b,
.c {
width: 100px;
}
.c {
height: 200px;
}