bart plessers wrote:
[snip]
So I am wondering,
is it possible to use variables or something like that to give a name
to custom color
and use this name for the rest of the style sheet?
In example:
ThemeColor1 = #012345
ThemeColor2 = #678901
ThemeColor3 = #234567
ThemeColor4 = #890123
and then
BODY
{
BACKGROUND: %ThemeColor1%
color:%ThemeColor2%;
}
etc...
can this be done in stylesheets?
can this be done in ASP?
I asked a similar question in another NG, and the answer was "no" in CSS:
Giving names to values in style sheets?
http://groups.google.com/gr********************************@newsfep1-gui.server.ntli.net
But I use 2 techniques that you may find useful:
- I try where possible in the CSS to use rules that declare colours to
multiple selectors:
selector1, selector2, selector3 { background-color: #012345; }
So I only need to change the colour value once in the CSS if I don't like
#012345 for that theme.
- I use a class in the body tag to identify the theme (which applies to
background colour, text colour, link colours, border colours, etc). (It has
been pointed out that I could, and perhaps should, have used id). Then this
results in blocks of rules in the CSS such as:
http://www.barry.pearson.name/assets...photograph.css
/* Styles for photo pages with eggshell background. */
body.eggshell { background-color: #DFD4BC; background-image:
url(eggshell.gif); color: #272727; }
body.eggshell a:link, body.eggshell a:visited { color: #0000FF;
text-decoration: none; }
body.eggshell a:hover { color: #FF0000; text-decoration: none;
background-color: #FFFFFF; }
body.eggshell div.middle, body.eggshell div.inner { padding: 7px; border:
solid #554433 1px; }
body.eggshell div.middle { border-left-color: #FFF7EE; border-top-color:
#FFF7EE; }
body.eggshell div.inner { border-right-color: #FFF7EE; border-bottom-color:
#FFF7EE; }
/* Styles for photo pages with dark green background. */
body.darkgreen { background-color: #0B360B; background-image:
url(dark_green.gif); color: #C1C1C1; }
body.darkgreen a:link, body.darkgreen a:visited { color: #4444FF;
text-decoration: none; }
body.darkgreen a:hover { color: #FF0000; text-decoration: none;
background-color: #FFFFFF; }
body.darkgreen div.middle, body.darkgreen div.inner { padding: 7px; border:
solid #000000 1px; }
body.darkgreen div.middle { border-left-color: #007700; border-top-color:
#007700; }
body.darkgreen div.inner { border-right-color: #007700; border-bottom-color:
#007700; }
(I'm not sure how well those actually address your problem).
--
Barry Pearson
http://www.Barry.Pearson.name/photography/ http://www.BirdsAndAnimals.info/ http://www.ChildSupportAnalysis.co.uk/