2.19.2011

Posterous CSS? NO! But you can AUTOPOST! What you'll need to UNDERSTAND! thanks tantek





Colored?
Syntax of CSS rules in HTML's "style" attribute





Posterous CSS? NO! But you can AUTOPOST! What you'll need to UNDERSTAND! thanks tantek...

Syntax of CSS rules in HTML's "style" attribute




This version: W3C Working Draft 25 October 2000
http://www.w3.org/TR/2000/WD-css-style-attr-20001025
Latest version:
http://www.w3.org/TR/css-style-attr
Previous version:
-
Editors:
Tantek Çelik (Microsoft), <tantekc@microsoft.com>
Bert Bos (W3C), <bert@w3.org>

Abstract

HTML provides a "style" attribute on most elements, to hold a fragment of a style sheet that applies to those elements. One of the possible style sheet languages is CSS. This draft describes the syntax of the CSS fragment that can be used in the "style" attribute.

Status of this document

This section describes the status of this document at the time of its publication.
This draft has been produced by the CSS working group as part of the style activity. It is a public W3C Working Draft for review by W3C members and other interested parties. As a draft document it may be updated, replaced, or obsoleted by other documents at any time. It is inappropriate to use W3C Working Drafts as reference material or to cite them as other than "work in progress."
Comments are invited and may be sent to the public mailing list www-style@w3.org (see instructions for subscribing), or to the editors. Discussions should take place on the mailing list.
A list of current public W3C Working Drafts can be found at http://www.w3.org/TR.

Table of contents


1. History

HTML 4.0 introduced the STYLE attribute, whose contents could contain any styling language (through the use of META HTTP-EQUIV Content-Style-Type), but by default, and in practice, has only contained CSS. XHTML Modularization introduced the Style Attribute Module which also has a STYLE attribute whose semantics are the same as that in HTML 4. SVG also has a language neutral Style attribute, whose language is specified with the contentStyleType attribute which has the default value of "text/css". MathML states that all MathML elements accept the Style attribute to facilitate compatibility with CSS.
This document recommends that any future XML based languages which have presentational information (whether visual, aural, tactile or other) also add a STYLE attribute which similarly permits the user to use CSS to style the document and elements in documents written in that language.
Here are a few examples:
  1. Only setting properties on the element itself, no pseudo-elements or pseudo-classes:
    <p style="color: #090; line-height: 1.2">...</p>
  2. Setting properties on the element, as well as on the first letter of the element, by means of the ':first-letter' pseudo-element. Note that curly braces ({...}) are required in this case:
    <p style="{color: #090; line-height: 1.2}
    
              :first-letter {color: #900}">...</p>
  3. Setting properties on a source anchor for each of its dynamic states, using pseudo-classes:
    <a style="{color: #900}
              :link {background: #ff0}
              :visited {background: #fff}
    
              :hover {outline: thin red solid}
              :active {background: #00f}">...</a>
This document defines both the simple case (only properties on the element itself, example 1), as well as the more complex case (properties on the element's pseudo-elements and pseudo-classes, examples 2 and 3).

2. Grammar

The syntax of the CSS fragment that is allowed in the HTML "style" attribute can be formally specified as follows:
inline-stylesheet
  : S* [ declarations | inline-ruleset* ]
  ;
declarations
  : declaration [ ';' S* declaration ]*
  ;
inline-ruleset
  : [ pseudo* S* [ ',' S* pseudo* S* ]* ]?
    '{' S* declarations '}' S*
  ; 
Please refer to the grammar in appendix D of the CSS2 specification for the definition of the symbols not defined here.
The same rules for forward-compatible parsing apply to the inline style sheet as to a normal style sheet. See chapter 4 of the CSS2 specification.

3. Cascading order

CSS already defines the meaning of the case where the inline fragment consists of declarations only. Briefly stated: the declarations have the same order in the cascade as if the they were in a rule-set at the end of the author's style sheet with a "specificity" equal to that of a selector consisting of one ID-selector (specificity: a=1, b=0, c=0). For example:
<span style="font-weight: bold">...</span>
This rule is easily generalized to the case where the inline fragment contains inline rule-sets: the declarations are treated the same as if they occured in the same order at the end of the author's style sheet with a specificity equal to that of a selector with one ID-selector and as many pseudo-elements and pseudo-classes as in the inline rule-set. Some examples:
<p style="{font-weight: bold}               /* a=1 b=0 c=0 */
          :active {color: green}            /* a=1 b=1 c=0 */
          :first-letter {color: #369}       /* a=1 b=0 c=1 */
          :first-letter:active {color: red} /* a=1 b=1 c=1 */
         ">...</p>
Please refer to chapter 6 of CSS2 for the rest of the cascading rules.

References

[CSS2]
Bert Bos; Håkon Wium Lie; Chris Lilley; Ian Jacobs. Cascading Style Sheets, level 2. 1998. W3C Recommendation. URL: http://www.w3.org/TR/REC-CSS2
[HTML40]
Raggett, D.; Le Hors, A.; Jacobs, I.. HTML 4.0 Specification. 8 July 1997. W3C Recommendation. URL: http://www.w3.org/TR/REC-html40
Valid HTML 4.01 Transitional






Posterous Nazis? Yes


So get used to this link






Colored?


Colored? Posterous? Not unless you spend the next two weeks straight learning ever version of CSs there is--especially the inline style rules as it applies to third-party user interface: Colored_Waiting_Room_SignColored? Posterous? Back of the Bus, Rosa Parks! Unless you spend the next two weeks learning every version of CSS --especially inline style rules as it applies to third-party User Interface









Inline visited tag how?
is it allowed?
Clark




#:1177374
 1:44 am on Mar 8, 2006 (gmt 0)

Are you allowed to place a visited color inline?

What is the syntax?
Something like this?
<a style="visited:#CCCCCC">word</a>

Maujor




#:1177375
 7:48 pm on Mar 8, 2006 (gmt 0)

Hello Clark,
No, CSS pseudo classes like a:hover aren't allowed inline. So, there isn't a CSS way to achieve the effect you are trying.
VidGa




#:1177376
 8:16 pm on Mar 8, 2006 (gmt 0)

"So, there isn't a CSS way to achieve the effect you are trying."

I wouldn't go that far -- there's no way to achieve the desired effect with inline style, but a simple class can get the job done just as easily.
Are there any details of what you're trying to do that make classes undesirable?
Maujor




#:1177377
 8:25 pm on Mar 8, 2006 (gmt 0)

"Are you allowed to place a visited color inline?"
The effect desired is "place a visited color inline"
and the answer is: There isn't a CSS way to achieve the effect.
DrDoc




#:1177378
 8:28 pm on Mar 8, 2006 (gmt 0)

Actually, there is a working draft (WD) which provides a solution ...
[w3.org...]



<a href="http://www.w3.org/"
style="{color: #900}
:link {background: #ff0}
:visited {background: #fff}
:hover {outline: thin red solid}
:active {background: #00f}">...</a>

However, as a WD, I don't think there are any browsers out there supporting this syntax as of yet ... as it is subject to change.