Inheritance in CSS as in OOP?

Question

does anybody know a way or a tool how inheritance can be used in CSS independent of the structure of the elements? Example:

.bg_red {
  background: red; 
}

.bold {
  font-weight: bold;
}

.bg_red_and_bold {
  //this class should inherit all the properties of the above two classes
}

I hope it is clear what I mean...

Thanks

Answer 1

There is no way you can do that in CSS, but since you are looking for tools as well, you might look into CSS preprocessing:

• LESS
• SASS

Their mixin and @extend features should do what you are looking for.