W3C home > Mailing lists > Public > www-style@w3.org > September 1999

CSS-Tranformation mechanism and modularizing CSS

From: Sjoerd Visscher <sjoerd@heeten.nl>
Date: Mon, 27 Sep 1999 23:59:37 +0200
Message-ID: <006701bf0933$99d7c4e0$1400000a@beneden>
To: "www-style" <www-style@w3.org>

Seeing this discussion about BECSS and if it should be allowed
inside a style sheet, I want to propose an idea I've had for
a while now:

Seperately defining the transformation part of CSS (CSST),
in such a way that it can be used for all kinds of purposes.

What is the transformation part of CSS?
I think it is: "dynamically adding attributes and content
to a (already structured) document".
These attributes and content do not have to conform to
a DTD or Schema of the document. They are added for
presentational purposes only.

To allow arbitrary attributes to be added, namespaces
have to be added to the *attributes*.
An example:

@namespace html url(http://www.w3.org/TR/xhtml11)
@namespace css url(http://www.w3.org/TR/CSS3)

html|h1 {
    css|font:200% arial,helvetica;

This way
<h1 xmlns="http://www.w3.org/TR/xhtml11">Header 1</h1>
is turned into
<h1 xmlns="http://www.w3.org/TR/xhtml11" onclick="func(event)"
css:font="200% arial,helvetica">Header 1</h1>

With this functionality CSS3 can be described as a set
of attributes, and could also be modularized.
Aural style-sheets f.e. could be defined separately,
and it would be given a separate namespace.

What do you think?

Sjoerd Visscher

PS. Personally I would like an XML version even more:

<csst xmlns="http://www.w3.org/TR/CSST"

<rule media="screen" importance="1">
        This rule set the font for the html:H1 tag
        and adds an onclick event-handler to it.
    <target html:onclick="func(event)" css:font="200% arial,helvetica" />

        This adds style to H2 and H3, when H3 is inside an H2,
        or when an H3 follows an H2.
        !2 behind an element-name means 'add the attributes of
        target number two to these elements'.
    <sel>html|h2!1 html|h3!2</sel>
    <sel>html|h2!1 + html|h3!2</sel>
    <target nr="1" css:fontSize="150%" css:fontWeight="bold"
css:fontStyle="normal" />
    <target nr="2" css:fontSize="120%" css:fontWeight="normal"
css:fontStyle="italic" />


(Of course this is a bit too much to go for in one post,
but I hope it spawnes some ideas.)
Received on Monday, 27 September 1999 18:02:16 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:26:51 UTC