grouping css styles for future use

[k_romych]

Hi
I am just wandering if there is any way in css file to created something like groups or objects of css styles that can be applied to particular class/element/id later.
For example I want to have few different background styling (bg1, bg2, bg3) and border styling (brd1, ,brd2, brd3) and I want an element .class to have bg2 and bdr1 styles. I just dont want to duplicate css styles and trying to avoid giving too many classes to an element.
Hope it make sense.
Thanks

[Ingolme]

CSS doesn't have a mechanism to do that, but you could look into CSS precompilers like LESS or SASS which include a lot of functionality to organize CSS development.

 

I would not suggest littering your HTML with class names that describe what the element should look like. You should use the class names to describe what the element is or what kind of content it contains.

[COBOLdinosaur]

You might want to re-think putting in a lot of styling that you are not using. There is no way for the parsers to kinow what will actually be used by the page so they must parse and serialize all declarations and properties. That will add a small additional time to the page load and make the display slightly less responsive because the re-paint cycles take longer and you end up with fewer paint cycles per second because the rendering engine has to work with a larger amount of data then is actually needed.

 

The degradation is not big unless you create a really big mess, but from a maintenance standpoint you may be creating more work for yourself instead of less when you look at how simple it is to add, remove of change CSS rules.