Proposal/idea: variables in CSS

Hi,

I have a feature request for the CSS spec.

(I looked around the W3C site trying to find the most appropriate place to
send such a suggestion, and this list was the only place I could find. I
searched the list archives and didn't see anything similar to this idea,
but surely someone has thought of it before. I am completely new to the
list and hope my post is not out of line; but if so, please disregard it.)

In some future incarnation of CSS (maybe CSS4?), I would like to be able
to set some variables, the contents of which would be replicated in all
instances of the variable within that style sheet. For example:

var=sans1 {font-family: "gill sans","trebuchet
ms",verdana,helvetica,arial,sans-serif;}
var=sans2 {font-family: verdana,geneva,arial,sans-serif; [additional
definitions, if desired] }

h1 {sans1; font-size: 20px; line-height: 22px; margin: 0 40px 10px 30px;}
h2 {sans1; font-size: 18px; line-height: 20px; margin: 30px auto 6px 0;}
h3 {sans1; font-size: 14px; line-height: 15px; margin: 20px auto 6px 0;}
p {sans2; font-size: 11px; line-height: 15px;margin: 0 0 12px 0;}

OR

var sans1=("gill sans","trebuchet ms",verdana,helvetica,arial,sans-serif)
var sans2=(verdana,geneva,arial,sans-serif)

h1 {font-family: sans1; font-size: 20px; line-height: 22px; margin: 0 40px
10px 30px;}
h2 {font-family: sans1; font-size: 18px; line-height: 20px; margin: 30px
auto 6px 0;}
h3 {font-family: sans1; font-size: 14px; line-height: 15px; margin: 20px
auto 6px 0;}
p {font-family: sans2; font-size: 11px; line-height: 15px;margin: 0 0 12px 0;}

I don't know what the best syntax for this would be. var=... was just off
the top of my head, and might be confused with the XHTML2 element with the
same name, and also with scripting language variables. I'm not personally
interested in the details of how it would be implemented, that could be
figured out by the W3C or others.

But I do know that everyone is repeating many definitions in their style
sheets, especially font "sets." Variables would be one more tool we could
use, and would often make it easier for humans to write and read CSS code.

I am aware that you can already do:
h1, h2, h3, ... {font-family: "gill sans","trebuchet
ms",verdana,helvetica,arial,sans-serif;}
I do a lot of that already, but this has drawbacks in many cases,
particularly when using numerous classes to which you are applying a
different font-family from that of the unclassed attribute.

An even more extensive method for the use of variables would provide even
greater benefits to web developers. Variables in (X)HTML could serve as an
*easy* way to incorporate repeated bits of text or code of any kind into
multiple web pages.
<html>
<head>
<link rel="variables" type="text/var" href="/global.var">
(This would be an alternative to SSI, which works well for a few sections
of code, but is not often utilized for small bits of text, or many of
them.) But I suppose HTML is off-topic for this list.

I know that some publishing programs (FrameMaker and probably others)
allow variable creation.

Surely introducing variables to the web cannot be a completely new idea. I
assume that someone has thought of it before and proposed it (although I
have no such knowledge). If anyone knows the status of such ideas, I'd be
curious to find out.

Best wishes,

Larry Israel
http://members.cruzio.com/~lisrael
Freelance web designer & tech writer

Received on Friday, 17 January 2003 02:02:06 UTC