css variables

Joseph Sinclair plug-discussion at stcaz.net
Wed Feb 7 23:39:12 MST 2007


No.  There is no variable support in CSS, and there never will be.  CSS is like HTML, it's a descriptive structure, not prescriptive (think book versus printer).
XSL *is* prescriptive, and would be ideal for your use, except the browser support (in all browsers) for XSL is entirely non-existent (only XSLT is supported, and poorly at that), so you can't actually use it.

The best way to accomplish what you're looking to do is have multiple rules for each relevant style (they're additive) and group the "constant" portions at the top of the CSS.

Example:
<style>
  .patrician { color: purple; }
  .warning { color: red; }
  <<Bunch of other stuff>>
  .patrician
  {
    font-family: PalatinoOldEnglish;
    font-size: 1.2em
    ...
  }
  .warning
  {
    font-family: TempusBlock;
    font-size: 2.2em;
    font-weight: 900;
    text-decoration: underline;
    border-width: medium;
    border-style: ridge;
    ...
  }
</style>

Note how the colors are at the top, with the remaining details someplace later.  This works, but it's not as clean as it could be.
For the best results, using some server-side code to generate the CSS on the fly, filling in constants as needed is probably best.

==Joseph++

Craig White wrote:
> I can't find anything in w3.org specifications on stylesheets that
> suggests that I can do this but is it possible to have a 'variable' that
> I could substitute within a single stylesheet?
> 
> What I am looking for is to define a color - say medblue = #466AD2
> 
> and then use &medblue; or whatever to refer to it in various
> classes/id's
> 
> Possible?
> 


More information about the PLUG-discuss mailing list