Question

many websites join the same propery of css rule in their css file, I want to use compass sass to complete this job, I found that extend method can do it, but it must extend base an selector, any way not to output the base css selector?,for example.

.a{color:red;font-size:10px;}
.b{color:red:font-weight:bold;}

they has same “color:red”.if I want to ouput

.a,.b{color:red;}

I must extend .c

.c{color:red;}

but actually I don’t want .c display at my css file. how to do it?

Answer 1

In Sass 3.2, they added a feature that does just that: http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#placeholders

Basically, use a % instead of a . to make a silent class that’s only for extending.

%c {
    color: green;
}

.a, .b {
    @extend %c;
}