Skip to content

Commit

Permalink
[] (0) Filling in the rendering section: list styles; table borders; …
Browse files Browse the repository at this point in the history 
…align=justify.

git-svn-id: http://svn.whatwg.org/webapps@2753 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
@Hixie
Hixie committed Feb 4, 2009
1 parent 04ee2e8 commit 8c322c3
Show file tree
Hide file tree
Showing 2 changed files with 421 additions and 36 deletions.
226 changes: 209 additions & 17 deletions index
View file
Expand Up @@ -56054,10 +56054,6 @@ td, th { padding: 1px; }</pre>
to the dimension property">map to the dimension property</a> 'height'
on the element.</p>

<p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-height>height</code> attributes <a href=#maps-to-the-dimension-property title="maps
to the dimension property">map to the dimension property</a> 'height'
on the element.</p>

<p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-width>width</code> attributes <a href=#maps-to-the-dimension-property title="maps
to the dimension property">map to the dimension property</a> 'width'
on the element.</p>
Expand Down Expand Up @@ -56147,12 +56143,12 @@ tfoot[valign=baseline], tr[valign=baseline], td[valign=baseline], th[valign=base
<code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
<code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements, when they have an
<code title=attr-align>align</code> attribute whose value is an
<a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">left</code>" or "<code title="">justify</code>", are
expected to left-align text within themselves, as if they had their
'text-align' property set to 'left' in a <a href=#presentational-hints title="presentational
hints">presentational hint</a>, and to left-align blocks and
tables within them, as if their descendants had their 'margin-right'
property set to 'auto' in <a href=#presentational-hints>presentational hints</a>.</p>
<a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">left</code>", are expected to left-align text within
themselves, as if they had their 'text-align' property set to 'left'
in a <a href=#presentational-hints title="presentational hints">presentational hint</a>,
and to left-align blocks and tables within them, as if their
descendants had their 'margin-right' property set to 'auto' in
<a href=#presentational-hints>presentational hints</a>.</p>

<p>The <code><a href=#the-div-element>div</a></code>, <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>,
<code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
Expand All @@ -56165,6 +56161,17 @@ tfoot[valign=baseline], tr[valign=baseline], td[valign=baseline], th[valign=base
their descendants had their 'margin-left' property set to 'auto' in
<a href=#presentational-hints>presentational hints</a>.</p>

<p>The <code><a href=#the-div-element>div</a></code>, <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>,
<code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
<code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements, when they have an
<code title=attr-align>align</code> attribute whose value is an
<a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">justify</code>", are expected to full-justify text within
themselves, as if they had their 'text-align' property set to
'justify' in a <a href=#presentational-hints title="presentational hints">presentational
hint</a>, and to left-align blocks and tables within them, as if
their descendants had their 'margin-right' property set to 'auto' in
<a href=#presentational-hints>presentational hints</a>.</p>

<p>In all these cases, the effect on descendants is expected to only
extend to descendants that do not themselves have an applicable
<code title=attr-align>align</code> attribute.</p>
Expand All @@ -56191,8 +56198,74 @@ sub, sup { line-height: normal; }
:visited { color: purple; }
body { color: black; background: white; }
mark { background: yellow; color: black; }
table { border-color: gray; }
thead, tbody, tfoot, tr { border-color: inherit; }</pre>

table, td, th { border-color: gray; }
thead, tbody, tfoot, tr { border-color: inherit; }
table[rules=none], table[rules=groups], table[rules=rows],
table[rules=cols], table[rules=all], table[frames=void],
table[frames=above], table[frames=below], table[frames=hsides],
table[frames=lhs], table[frames=rhs], table[frames=vsides],
table[frames=box], table[frames=border],
table[rules=none] &gt; tr &gt; td, table[rules=none] &gt; tr &gt; th,
table[rules=groups] &gt; tr &gt; td, table[rules=groups] &gt; tr &gt; th,
table[rules=rows] &gt; tr &gt; td, table[rules=rows] &gt; tr &gt; th,
table[rules=cols] &gt; tr &gt; td, table[rules=cols] &gt; tr &gt; th,
table[rules=all] &gt; tr &gt; td, table[rules=all] &gt; tr &gt; th,
table[frames=void] &gt; tr &gt; td, table[frames=void] &gt; tr &gt; th,
table[frames=above] &gt; tr &gt; td, table[frames=above] &gt; tr &gt; th,
table[frames=below] td, table[frames=below] &gt; tr &gt; th,
table[frames=hsides] &gt; tr &gt; td, table[frames=hsides] &gt; tr &gt; th,
table[frames=lhs] &gt; tr &gt; td, table[frames=lhs] &gt; tr &gt; th,
table[frames=rhs] &gt; tr &gt; td, table[frames=rhs] &gt; tr &gt; th,
table[frames=vsides] &gt; tr &gt; td, table[frames=vsides] &gt; tr &gt; th,
table[frames=box] &gt; tr &gt; td, table[frames=box] &gt; tr &gt; th,
table[frames=border] &gt; tr &gt; td, table[frames=border] &gt; tr &gt; th,
table[rules=none] &gt; thead &gt; tr &gt; td, table[rules=none] &gt; thead &gt; tr &gt; th,
table[rules=groups] &gt; thead &gt; tr &gt; td, table[rules=groups] &gt; thead &gt; tr &gt; th,
table[rules=rows] &gt; thead &gt; tr &gt; td, table[rules=rows] &gt; thead &gt; tr &gt; th,
table[rules=cols] &gt; thead &gt; tr &gt; td, table[rules=cols] &gt; thead &gt; tr &gt; th,
table[rules=all] &gt; thead &gt; tr &gt; td, table[rules=all] &gt; thead &gt; tr &gt; th,
table[frames=void] &gt; thead &gt; tr &gt; td, table[frames=void] &gt; thead &gt; tr &gt; th,
table[frames=above] &gt; thead &gt; tr &gt; td, table[frames=above] &gt; thead &gt; tr &gt; th,
table[frames=below] td, table[frames=below] &gt; thead &gt; tr &gt; th,
table[frames=hsides] &gt; thead &gt; tr &gt; td, table[frames=hsides] &gt; thead &gt; tr &gt; th,
table[frames=lhs] &gt; thead &gt; tr &gt; td, table[frames=lhs] &gt; thead &gt; tr &gt; th,
table[frames=rhs] &gt; thead &gt; tr &gt; td, table[frames=rhs] &gt; thead &gt; tr &gt; th,
table[frames=vsides] &gt; thead &gt; tr &gt; td, table[frames=vsides] &gt; thead &gt; tr &gt; th,
table[frames=box] &gt; thead &gt; tr &gt; td, table[frames=box] &gt; thead &gt; tr &gt; th,
table[frames=border] &gt; thead &gt; tr &gt; td, table[frames=border] &gt; thead &gt; tr &gt; th,
table[rules=none] &gt; tbody &gt; tr &gt; td, table[rules=none] &gt; tbody &gt; tr &gt; th,
table[rules=groups] &gt; tbody &gt; tr &gt; td, table[rules=groups] &gt; tbody &gt; tr &gt; th,
table[rules=rows] &gt; tbody &gt; tr &gt; td, table[rules=rows] &gt; tbody &gt; tr &gt; th,
table[rules=cols] &gt; tbody &gt; tr &gt; td, table[rules=cols] &gt; tbody &gt; tr &gt; th,
table[rules=all] &gt; tbody &gt; tr &gt; td, table[rules=all] &gt; tbody &gt; tr &gt; th,
table[frames=void] &gt; tbody &gt; tr &gt; td, table[frames=void] &gt; tbody &gt; tr &gt; th,
table[frames=above] &gt; tbody &gt; tr &gt; td, table[frames=above] &gt; tbody &gt; tr &gt; th,
table[frames=below] td, table[frames=below] &gt; tbody &gt; tr &gt; th,
table[frames=hsides] &gt; tbody &gt; tr &gt; td, table[frames=hsides] &gt; tbody &gt; tr &gt; th,
table[frames=lhs] &gt; tbody &gt; tr &gt; td, table[frames=lhs] &gt; tbody &gt; tr &gt; th,
table[frames=rhs] &gt; tbody &gt; tr &gt; td, table[frames=rhs] &gt; tbody &gt; tr &gt; th,
table[frames=vsides] &gt; tbody &gt; tr &gt; td, table[frames=vsides] &gt; tbody &gt; tr &gt; th,
table[frames=box] &gt; tbody &gt; tr &gt; td, table[frames=box] &gt; tbody &gt; tr &gt; th,
table[frames=border] &gt; tbody &gt; tr &gt; td, table[frames=border] &gt; tbody &gt; tr &gt; th,
table[rules=none] &gt; tfoot &gt; tr &gt; td, table[rules=none] &gt; tfoot &gt; tr &gt; th,
table[rules=groups] &gt; tfoot &gt; tr &gt; td, table[rules=groups] &gt; tfoot &gt; tr &gt; th,
table[rules=rows] &gt; tfoot &gt; tr &gt; td, table[rules=rows] &gt; tfoot &gt; tr &gt; th,
table[rules=cols] &gt; tfoot &gt; tr &gt; td, table[rules=cols] &gt; tfoot &gt; tr &gt; th,
table[rules=all] &gt; tfoot &gt; tr &gt; td, table[rules=all] &gt; tfoot &gt; tr &gt; th,
table[frames=void] &gt; tfoot &gt; tr &gt; td, table[frames=void] &gt; tfoot &gt; tr &gt; th,
table[frames=above] &gt; tfoot &gt; tr &gt; td, table[frames=above] &gt; tfoot &gt; tr &gt; th,
table[frames=below] td, table[frames=below] &gt; tfoot &gt; tr &gt; th,
table[frames=hsides] &gt; tfoot &gt; tr &gt; td, table[frames=hsides] &gt; tfoot &gt; tr &gt; th,
table[frames=lhs] &gt; tfoot &gt; tr &gt; td, table[frames=lhs] &gt; tfoot &gt; tr &gt; th,
table[frames=rhs] &gt; tfoot &gt; tr &gt; td, table[frames=rhs] &gt; tfoot &gt; tr &gt; th,
table[frames=vsides] &gt; tfoot &gt; tr &gt; td, table[frames=vsides] &gt; tfoot &gt; tr &gt; th,
table[frames=box] &gt; tfoot &gt; tr &gt; td, table[frames=box] &gt; tfoot &gt; tr &gt; th,
table[frames=border] &gt; tfoot &gt; tr &gt; td, table[frames=border] &gt; tfoot &gt; tr &gt; th {
border-color: black;
}

</pre>

<hr><p>The <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>,
and <code><a href=#the-section-element>section</a></code> elements are expected to affect the styling
Expand Down Expand Up @@ -56402,9 +56475,8 @@ blink { text-decoration: blink; }
q:before { content: open-quote; }
q:after { content: close-quote; }

nobr, td[nowrap], th[nowrap] { white-space: nowrap; }
nobr { white-space: nowrap; }
listing, plaintext, pre, xmp { white-space: pre; }
pre[wrap] { white-space: pre-wrap; }

ol { list-style-type: decimal; }

Expand Down Expand Up @@ -56439,6 +56511,8 @@ ul ul dl, ul ul menu, ul ul ul {
}

iframe { border: 2px inset; }
table { border-style: outset; }
td, th { border-style: inset; }

[dir=rtl] { direction: rtl; unicode-bidi: embed; }
[dir=ltr] { direction: lrt; unicode-bidi: embed; }
Expand All @@ -56448,10 +56522,128 @@ bdo[dir] { unicode-bidi: bidi-override; }</pre>
for the locales and languages understood by the user are expected to
be present.</p>

<!-- XXX <ol>/<ul> type (1|a|A|i|I|disc|circle/round|square), start (n); <li> type (A|a|I|i|1|disc|circle/round|square), value (n) -->
<hr><p>The following rules are also expected to apply, as
<a href=#presentational-hints>presentational hints</a>:</p>

<hr><p class=XXX>...tables...</p>
<!-- table: rules/layout/frames; <table border> (border => border=1); -->
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);

td[nowrap], th[nowrap] { white-space: nowrap; }
pre[wrap] { white-space: pre-wrap; }

ol[type=1], li[type=1] { list-style-type: decimal; }
ol[type=a], li[type=a] { list-style-type: lower-alpha; }
ol[type=A], li[type=A] { list-style-type: upper-alpha; }
ol[type=i], li[type=i] { list-style-type: lower-roman; }
ol[type=I], li[type=I] { list-style-type: upper-roman; }
ul[type=disc], li[type=disc] { list-style-type: disc; }
ul[type=circle], li[type=circle] { list-style-type: circle; }
ul[type=square], li[type=square] { list-style-type: square; }

table[rules=none], table[rules=groups], table[rules=rows],
table[rules=cols], table[rules=all] {
border-style: none;
border-collapse: collapse;
}

table[frames=void] { border-style: hidden hidden hidden hidden; }
table[frames=above] { border-style: solid hidden hidden hidden; }
table[frames=below] { border-style: hidden hidden solid hidden; }
table[frames=hsides] { border-style: solid hidden solid hidden; }
table[frames=lhs] { border-style: hidden hidden hidden solid; }
table[frames=rhs] { border-style: hidden solid hidden hidden; }
table[frames=vsides] { border-style: hidden solid hidden solid; }
table[frames=box],
table[frames=border] { border-style: solid solid solid solid; }

table[frames=void] &gt; tr &gt; td, table[frames=void] &gt; tr &gt; th,
table[frames=above] &gt; tr &gt; td, table[frames=above] &gt; tr &gt; th,
table[frames=below] td, table[frames=below] &gt; tr &gt; th,
table[frames=hsides] &gt; tr &gt; td, table[frames=hsides] &gt; tr &gt; th,
table[frames=lhs] &gt; tr &gt; td, table[frames=lhs] &gt; tr &gt; th,
table[frames=rhs] &gt; tr &gt; td, table[frames=rhs] &gt; tr &gt; th,
table[frames=vsides] &gt; tr &gt; td, table[frames=vsides] &gt; tr &gt; th,
table[frames=box] &gt; tr &gt; td, table[frames=box] &gt; tr &gt; th,
table[frames=border] &gt; tr &gt; td, table[frames=border] &gt; tr &gt; th,
table[frames=void] &gt; thead &gt; tr &gt; td, table[frames=void] &gt; thead &gt; tr &gt; th,
table[frames=above] &gt; thead &gt; tr &gt; td, table[frames=above] &gt; thead &gt; tr &gt; th,
table[frames=below] td, table[frames=below] &gt; thead &gt; tr &gt; th,
table[frames=hsides] &gt; thead &gt; tr &gt; td, table[frames=hsides] &gt; thead &gt; tr &gt; th,
table[frames=lhs] &gt; thead &gt; tr &gt; td, table[frames=lhs] &gt; thead &gt; tr &gt; th,
table[frames=rhs] &gt; thead &gt; tr &gt; td, table[frames=rhs] &gt; thead &gt; tr &gt; th,
table[frames=vsides] &gt; thead &gt; tr &gt; td, table[frames=vsides] &gt; thead &gt; tr &gt; th,
table[frames=box] &gt; thead &gt; tr &gt; td, table[frames=box] &gt; thead &gt; tr &gt; th,
table[frames=border] &gt; thead &gt; tr &gt; td, table[frames=border] &gt; thead &gt; tr &gt; th,
table[frames=void] &gt; tbody &gt; tr &gt; td, table[frames=void] &gt; tbody &gt; tr &gt; th,
table[frames=above] &gt; tbody &gt; tr &gt; td, table[frames=above] &gt; tbody &gt; tr &gt; th,
table[frames=below] td, table[frames=below] &gt; tbody &gt; tr &gt; th,
table[frames=hsides] &gt; tbody &gt; tr &gt; td, table[frames=hsides] &gt; tbody &gt; tr &gt; th,
table[frames=lhs] &gt; tbody &gt; tr &gt; td, table[frames=lhs] &gt; tbody &gt; tr &gt; th,
table[frames=rhs] &gt; tbody &gt; tr &gt; td, table[frames=rhs] &gt; tbody &gt; tr &gt; th,
table[frames=vsides] &gt; tbody &gt; tr &gt; td, table[frames=vsides] &gt; tbody &gt; tr &gt; th,
table[frames=box] &gt; tbody &gt; tr &gt; td, table[frames=box] &gt; tbody &gt; tr &gt; th,
table[frames=border] &gt; tbody &gt; tr &gt; td, table[frames=border] &gt; tbody &gt; tr &gt; th,
table[frames=void] &gt; tfoot &gt; tr &gt; td, table[frames=void] &gt; tfoot &gt; tr &gt; th,
table[frames=above] &gt; tfoot &gt; tr &gt; td, table[frames=above] &gt; tfoot &gt; tr &gt; th,
table[frames=below] td, table[frames=below] &gt; tfoot &gt; tr &gt; th,
table[frames=hsides] &gt; tfoot &gt; tr &gt; td, table[frames=hsides] &gt; tfoot &gt; tr &gt; th,
table[frames=lhs] &gt; tfoot &gt; tr &gt; td, table[frames=lhs] &gt; tfoot &gt; tr &gt; th,
table[frames=rhs] &gt; tfoot &gt; tr &gt; td, table[frames=rhs] &gt; tfoot &gt; tr &gt; th,
table[frames=vsides] &gt; tfoot &gt; tr &gt; td, table[frames=vsides] &gt; tfoot &gt; tr &gt; th,
table[frames=box] &gt; tfoot &gt; tr &gt; td, table[frames=box] &gt; tfoot &gt; tr &gt; th,
table[frames=border] &gt; tfoot &gt; tr &gt; td, table[frames=border] &gt; tfoot &gt; tr &gt; th {
border-style: solid;
}

table[rules=none] &gt; tr &gt; td, table[rules=none] &gt; tr &gt; th,
table[rules=none] &gt; thead &gt; tr &gt; td, table[rules=none] &gt; thead &gt; tr &gt; th,
table[rules=none] &gt; tbody &gt; tr &gt; td, table[rules=none] &gt; tbody &gt; tr &gt; th,
table[rules=none] &gt; tfoot &gt; tr &gt; td, table[rules=none] &gt; tfoot &gt; tr &gt; th,
table[rules=groups] &gt; tr &gt; td, table[rules=groups] &gt; tr &gt; th,
table[rules=groups] &gt; thead &gt; tr &gt; td, table[rules=groups] &gt; thead &gt; tr &gt; th,
table[rules=groups] &gt; tbody &gt; tr &gt; td, table[rules=groups] &gt; tbody &gt; tr &gt; th,
table[rules=groups] &gt; tfoot &gt; tr &gt; td, table[rules=groups] &gt; tfoot &gt; tr &gt; th,
table[rules=rows] &gt; tr &gt; td, table[rules=rows] &gt; tr &gt; th,
table[rules=rows] &gt; thead &gt; tr &gt; td, table[rules=rows] &gt; thead &gt; tr &gt; th,
table[rules=rows] &gt; tbody &gt; tr &gt; td, table[rules=rows] &gt; tbody &gt; tr &gt; th,
table[rules=rows] &gt; tfoot &gt; tr &gt; td, table[rules=rows] &gt; tfoot &gt; tr &gt; th {
border-style: none;
}

table[rules=groups] &gt; colgroup, table[rules=groups] &gt; thead,
table[rules=groups] &gt; tbody, table[rules=groups] &gt; tfoot {
border-style: solid;
}

table[rules=rows] &gt; tr, table[rules=rows] &gt; thead &gt; tr,
table[rules=rows] &gt; tbody &gt; tr, table[rules=rows] &gt; tfoot &gt; tr {
border-style: solid;
}

table[rules=cols] &gt; tr &gt; td, table[rules=cols] &gt; tr &gt; th,
table[rules=cols] &gt; thead &gt; tr &gt; td, table[rules=cols] &gt; thead &gt; tr &gt; th,
table[rules=cols] &gt; tbody &gt; tr &gt; td, table[rules=cols] &gt; tbody &gt; tr &gt; th,
table[rules=cols] &gt; tfoot &gt; tr &gt; td, table[rules=cols] &gt; tfoot &gt; tr &gt; th {
border-style: none solid none solid;
}

table[rules=all] &gt; tr &gt; td, table[rules=all] &gt; tr &gt; th,
table[rules=all] &gt; thead &gt; tr &gt; td, table[rules=all] &gt; thead &gt; tr &gt; th,
table[rules=all] &gt; tbody &gt; tr &gt; td, table[rules=all] &gt; tbody &gt; tr &gt; th,
table[rules=all] &gt; tfoot &gt; tr &gt; td, table[rules=all] &gt; tfoot &gt; tr &gt; th {
border-style: solid;
}</pre>

<p>When rendering <code><a href=#the-li-element>li</a></code> elements, user agents are expected
to use the ordinal value of the <code><a href=#the-li-element>li</a></code> element to render
the counter in the list item marker.</p>

<p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-border>border</code> attribute <a href=#maps-to-the-pixel-length-property title="maps
to the pixel length property">maps to the pixel length
properties</a> 'border-top-width', 'border-right-width',
'border-bottom-width', 'border-left-width' on the element. If the
attribute is present but its value cannot be parsed successfully, a
default value of 1px is expected to be used for that property
instead.</p>


<h4 id=resetting-rules-for-inherited-properties><span class=secno>10.3.7 </span>Resetting rules for inherited properties</h4>
Expand Down

0 comments on commit 8c322c3

Please sign in to comment.