'''Cascading Style Sheet''', or '''CSS''', is a mechanism for specifying style
and layout of structured documents, namely [HTML].



** See Also **

   [CSS2HTML]:   an attempt by [PN] to solve the problem of managing the styles of many websites

   [TkHTML]:   [NEM]: Version 3 now has excellent support for CSS.



** Tcl Resources **

   [http://bitbucket.org/smh377/cssparse%|%CSS parser written in Tcl], by [st3ve]:   



** Other Resources **

   [http://sass-lang.com/%|%Sass], "Syntactically Awesome Style Sheets":   



** Documentation **

   [http://www.w3.org/Style/CSS/%|%W3C home]:   

   [http://www.w3.org/TR/REC-CSS1%|%Cascading Style Sheets, level 1], W3C Recommendation 17 Dec 1996, revised 11 Apr 2008:   

   [http://www.htmlhelp.com/reference/css/%|%Cascading Style Sheets]:   A reference by the Web Design Group



** Description ***

Style sheets provide mechanism for separating display markup from structural
markup.  They are a named collection of attribute-property pairs. The style
properties correspond to [html%|%HTML] element properties.  Styles are applied
to html elements of a given type, html elements grouped in a <Span> or <Div>
block or html elements whose class/id attribute is set to the style name.

The specifcations for CSS include CSS1, CSS2, CSS3 (draft), and others.  New
specifications include 3D positioning and sizing of html elements.
Unforunately CSS uses different property names then HTML. These style
properties can be dynamically set in JavaScript through yet another name
convention.



*** [HTML] tags that are particularly relevant to CSS ***


   <'''Span'''>:   Defines-delimits a group of htmlElements and optionally names it. If you assign its class attribute with a style its grouping of elements will be stylized by it. Style assignment is as follows: class="someStyle".

   <'''Div'''>:   Same as Span but will draw the block on a newline. This breaks the flow. It can also be sized,autosized and positioned and given a z-depth. This uses the id rather than the class attribute for assignment: id="someStyle". There also is the idea of floating the the block element to some alignment direction. This will cause the next item to flow around the floated item. I guess a better way than a table to flow text around an image. (See Figure 1)

   <'''Style'''>:   


*** Formal Definition ***

ClassName {name:value [[name:value;]]* }
[[ ClassName { }]]*


** Declarations **

inline:

======none
<P style="color:red"> some text </P>
======

file inclusion in HTML head:

======
<style> ... </style>
======

file inclusion in html body:

======none
<link rel = "stylesheet" type="text/css" href="file.css">
======

file inclusion javascript:

======
<Style> @import url(file.css); </Style>
======


*** ClassNaming ***

======none
.theStyleClassName
P.theStyleClassName
======

*** Grouping ***

Upon declaring you can apply the attributes to several HtmlElement Classes at
once. This is a comma separated list. For unseparated list, see Nesting.

======
li ,em ,span {name:val;...}
======

*** Nesting ***

A sequence of tag names separated by whitespace instead of commas indicates
nested tags:
 
======
ul ul {color:red}
======

would cause the nested `<ul>` to be red:
 
======
<div>
    <ul>
        <ul>
            ...
        </ul>
    </ul>
</div>
======


*** Applying ***

In general, the most-specific style for each style attributed is what get
applied.


*** Precedence ***

increasing priority

CSS set by factory(IE. NN.)
User set as custom settings in the browser
Inside the html document by the author



** User Overrides **

[LV]: When a web site makes use of CSS, can a user override the values to get
the look s/he wishs?  And if so, how?

[MR] Look in your browser's preferences.. many do provide (global) settings for
ignoring CSS, or providing a personal stylesheet



** Case Study: [PN] **

[PN] 2004-09-12: I manage a whole heap of websites and use tcl to do this, with
applications that generate HTML pages and webpages that manage the sites. One
example is a Mall of e-shops each with its own style which the guys who run the
stores can change themselves. This includes the stylesheets for the shop pages.
I provide a webpage which allows the users to alter their shop page style
elements, rather than alter the CSS directly.

I want the pages to look good on lite browsers like TkHTML/BrowseX that
ignore CSS as well as on the swank browsers. So I want to embed as much of
the stylesheet as possible back into the HTML when pages are generated. So I
am looking for a CSS to HTML converter. This is an exercise in managing webpage 
style and keep it in one place.

[CSS2HTML] contains some of my ideas on this project.


** Misc **


[NEM] [http://wiki.tcl.tk/_/revision?N=1777&V=36%|%stated] that he was working
on a CSS parser.  Did it ever materialize?



<<categories>> Glossary