Page 1 of 1

CSS, Inheriting Colors

Posted: Fri Jun 09, 2006 1:15 am
by supermike
Is there a way that I can have multiple classes in my CSS that inherit colors from another class or one central source? That way, I can just change the color scheme at the top and it replicates down.

Posted: Fri Jun 09, 2006 1:32 am
by matthijs
Not exactly sure what you mean. Is the normal inheriting not enough?

Or maybe you want some kind of groups of styles?

Code: Select all

html:

<body class="bluestyle">
<div id="content">
..
</div>
</body>

or

<body class="redstyle">
<div id="content">
..
</div>
</body>


css:
body.bluestyle {
  color:#256;
}
.bluestyle #content {
  color:#258;
}
.bluestyle #content #intro {
  color:#235;
}

body.redstyle {
  color:#500;
}
.redstyle #content {
  color:#700;
}
.redstyle #content #intro {
  color:#900;
}
This way, you'll only have to change one class in the html for a complete styleswitch.

Posted: Fri Jun 09, 2006 1:35 am
by RobertGonzalez
When it comes to styling a page I usually write two stylesheets. One houses the colors of certain elements (body, h1, p, pre, etc...) and the others handle positioning and layout. Then, I can actually create several color variants of the same page and use them interchangeably depending on what I want to see.

You can call two stylesheets in the same manner that you call one.

Posted: Fri Jun 09, 2006 9:55 am
by pickle
Alternatively, you could write a PHP file that mimics a CSS file. That way you could store colours in a PHP variable.

Posted: Fri Jun 09, 2006 10:10 am
by RobertGonzalez
That's even sweeter. :)