Permalink
Browse files

[] (0) Start filling in the rendering section.

git-svn-id: http://svn.whatwg.org/webapps@2734 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information...
1 parent 65684cb commit f186b43893004247de53d5e96cc75c65f8e85d56 @Hixie Hixie committed Feb 2, 2009
Showing with 797 additions and 211 deletions.
  1. +423 −127 index
  2. +374 −84 source
View
550 index
@@ -34,7 +34,7 @@
<div class=head>
<p><a class=logo href=http://www.whatwg.org/ rel=home><img alt=WHATWG src=/images/logo></a></p>
<h1>HTML 5</h1>
- <h2 class="no-num no-toc" id=draft-recommendation-&mdash;-date:-01-jan-1901>Draft Recommendation &mdash; 1 February 2009</h2>
+ <h2 class="no-num no-toc" id=draft-recommendation-&mdash;-date:-01-jan-1901>Draft Recommendation &mdash; 2 February 2009</h2>
<p>You can take part in this work. <a href=http://www.whatwg.org/mailing-list>Join the working group's discussion list.</a></p>
<p><strong>Web designers!</strong> We have a <a href=http://blog.whatwg.org/faq/>FAQ</a>, a <a href=http://forums.whatwg.org/>forum</a>, and a <a href=http://www.whatwg.org/mailing-list#help>help mailing list</a> for you!</p>
<dl><dt>Multiple-page version:</dt>
@@ -1027,16 +1027,35 @@
<li><a href=#parsing-xhtml-fragments><span class=secno>9.4 </span>Parsing XHTML fragments</a></ol></li>
<li><a href=#rendering><span class=secno>10 </span>Rendering</a>
<ol>
- <li><a href=#rendering-and-menus/toolbars><span class=secno>10.1 </span>Rendering and menus/toolbars</a>
+ <li><a href=#introduction-8><span class=secno>10.1 </span>Introduction</a></li>
+ <li><a href=#hidden-elements><span class=secno>10.2 </span>Hidden elements</a></li>
+ <li><a href=#visual-media-defaults><span class=secno>10.3 </span>Visual media defaults</a>
<ol>
- <li><a href="#the-'icon'-property"><span class=secno>10.1.1 </span>The 'icon' property</a></ol></ol></li>
+ <li><a href=#introduction-9><span class=secno>10.3.1 </span>Introduction</a></li>
+ <li><a href=#display-types><span class=secno>10.3.2 </span>Display types</a></li>
+ <li><a href=#margins-and-padding><span class=secno>10.3.3 </span>Margins and padding</a></li>
+ <li><a href=#alignment><span class=secno>10.3.4 </span>Alignment</a></li>
+ <li><a href=#fonts-and-colors><span class=secno>10.3.5 </span>Fonts and colors</a></li>
+ <li><a href=#punctuation-and-decorations><span class=secno>10.3.6 </span>Punctuation and decorations</a></li>
+ <li><a href=#resetting-rules-for-inherited-properties><span class=secno>10.3.7 </span>Resetting rules for inherited properties</a></ol></li>
+ <li><a href=#form-controls-and-widgets><span class=secno>10.4 </span>Form controls and widgets</a></li>
+ <li><a href=#self-contained-features><span class=secno>10.5 </span>Self-contained features</a>
+ <ol>
+ <li><a href=#the-marquee-element><span class=secno>10.5.1 </span>The <code>marquee</code> element</a></li>
+ <li><a href=#the-hr-element-0><span class=secno>10.5.2 </span>The <code>hr</code> element</a></ol></li>
+ <li><a href=#other><span class=secno>10.6 </span>Other</a></li>
+ <li><a href=#rendering-and-menus/toolbars><span class=secno>10.7 </span>Rendering and menus/toolbars</a>
+ <ol>
+ <li><a href="#the-'icon'-property"><span class=secno>10.7.1 </span>The 'icon' property</a></ol></ol></li>
<li><a href=#obsolete-features><span class=secno>11 </span>Obsolete features</a>
<ol>
- <li><a href=#obsolete-elements><span class=secno>11.1 </span>Obsolete elements</a>
+ <li><a href=#self-contained-features-0><span class=secno>11.1 </span>Self-contained features</a>
<ol>
- <li><a href=#the-body-element-0><span class=secno>11.1.1 </span>The <code>body</code> element</a></li>
- <li><a href=#the-applet-element><span class=secno>11.1.2 </span>The <code>applet</code> element</a></ol></li>
- <li><a href=#conformance-checkers-0><span class=secno>11.2 </span>Conformance checkers</a></ol></li>
+ <li><a href=#the-applet-element><span class=secno>11.1.1 </span>The <code>applet</code> element</a></li>
+ <li><a href=#the-marquee-element-0><span class=secno>11.1.2 </span>The <code>marquee</code> element</a></ol></li>
+ <li><a href=#other-elements-and-attributes><span class=secno>11.2 </span>Other elements and attributes</a></li>
+ <li><a href=#other-dom-apis><span class=secno>11.3 </span>Other DOM APIs</a></li>
+ <li><a href=#conformance-checkers-0><span class=secno>11.4 </span>Conformance checkers</a></ol></li>
<li><a href=#no><span class=secno>12 </span>Things that you can't do with this specification because
they are better handled using other technologies that are further
described herein</a>
@@ -6264,7 +6283,7 @@ interface <dfn id=htmldocument>HTMLDocument</dfn> {
of the same name on the <code>SVGDocument</code> interface when the
user agent supports both HTML and SVG.</p>
- <hr><p><dfn id=the-body-element-1>The body element</dfn> of a document is the first child of
+ <hr><p><dfn id=the-body-element-0>The body element</dfn> of a document is the first child of
<a href=#the-html-element-0>the <code>html</code> element</a> that is either a
<code><a href=#the-body-element>body</a></code> element or a <code>frameset</code> element. If
there is no such element, it is null. If the body element is null,
@@ -6273,7 +6292,7 @@ interface <dfn id=htmldocument>HTMLDocument</dfn> {
<code>Document</code> object.</p>
<p>The <dfn id=dom-document-body title=dom-document-body><code>body</code></dfn>
- attribute, on getting, must return <a href=#the-body-element-1>the body element</a> of
+ attribute, on getting, must return <a href=#the-body-element-0>the body element</a> of
the document (either a <code><a href=#the-body-element>body</a></code> element, a
<code>frameset</code> element, or null). On setting, the following
algorithm must be run:</p>
@@ -6283,17 +6302,17 @@ interface <dfn id=htmldocument>HTMLDocument</dfn> {
<code><a href=#hierarchy_request_err>HIERARCHY_REQUEST_ERR</a></code> exception and abort these
steps.</li>
- <li>Otherwise, if the new value is the same as <a href=#the-body-element-1>the body
+ <li>Otherwise, if the new value is the same as <a href=#the-body-element-0>the body
element</a>, do nothing. Abort these steps.</li>
- <li>Otherwise, if <a href=#the-body-element-1>the body element</a> is not null, then
+ <li>Otherwise, if <a href=#the-body-element-0>the body element</a> is not null, then
replace that element with the new value in the DOM, as if the root
element's <code title="">replaceChild()</code> method had been
- called with the new value and <a href=#the-body-element-1 title="the body element">the
+ called with the new value and <a href=#the-body-element-0 title="the body element">the
incumbent body element</a> as its two arguments respectively,
then abort these steps.</li>
- <li>Otherwise, the <a href=#the-body-element-1>the body element</a> is null. Append
+ <li>Otherwise, the <a href=#the-body-element-0>the body element</a> is null. Append
the new value to the root element.</li>
</ol><!--XXX
@@ -6331,7 +6350,7 @@ interface <dfn id=htmldocument>HTMLDocument</dfn> {
<p>The <dfn id=dom-document-anchors title=dom-document-anchors><code>anchors</code></dfn>
attribute must return an <code><a href=#htmlcollection-0>HTMLCollection</a></code> rooted at the
<code>Document</code> node, whose filter matches only <code><a href=#the-a-element>a</a></code>
- elements with <code title=attr-a-name>name</code>
+ elements with <code title=attr-a-name><a href=#attr-a-name>name</a></code>
attributes.</p><!-- XXX note that such elements are non-conforming
-->
@@ -10362,7 +10381,7 @@ not-slash = %x0000-002E / %x0030-%10FFFF
<code><a href=#the-body-element>body</a></code> element.</p>
<p class=note>Some DOM operations (for example, parts of the
- <a href=#dnd>drag and drop</a> model) are defined in terms of "<a href=#the-body-element-1>the
+ <a href=#dnd>drag and drop</a> model) are defined in terms of "<a href=#the-body-element-0>the
body element</a>". This refers to a particular element in the
DOM, as per the definition of the term, and not any arbitrary
<code><a href=#the-body-element>body</a></code> element.</p>
@@ -10379,7 +10398,7 @@ not-slash = %x0000-002E / %x0030-%10FFFF
elements</a>.</p>
<p class=example>Thus, for example, a bubbling <code title=event-message><a href=#event-message>message</a></code> event fired on a child of
- <a href=#the-body-element-1>the body element</a> of a <code>Document</code> would first
+ <a href=#the-body-element-0>the body element</a> of a <code>Document</code> would first
trigger the <code title=handler-onmessage><a href=#handler-onmessage>onmessage</a></code>
<a href=#event-handler-content-attributes>event handler content attributes</a> of that element, then
that of the root <code><a href=#the-html-element>html</a></code> element, and only <em>then</em>
@@ -10789,7 +10808,7 @@ isn't his only passion. He also enjoys other pleasures.&lt;/p&gt;
<dd>Uses <code><a href=#htmlelement>HTMLElement</a></code>.</dd>
</dl><p>The <code><a href=#the-address-element>address</a></code> element represents the contact
information for the section it <a href=#applyToSection>applies</a>
- to. If it applies to <a href=#the-body-element-1>the body element</a>, then it instead
+ to. If it applies to <a href=#the-body-element-0>the body element</a>, then it instead
applies to the document as a whole.</p>
<div class=example>
@@ -11189,7 +11208,7 @@ isn't his only passion. He also enjoys other pleasures.&lt;/p&gt;
<li><p>Associate all nodes with the heading of the <a href=#concept-section title=concept-section>section</a> with which they are
associated, if any.</li>
- <li><p>If <var title="">current outlinee</var> is <a href=#the-body-element-1>the body
+ <li><p>If <var title="">current outlinee</var> is <a href=#the-body-element-0>the body
element</a>, then the outline created for that element is the
<a href=#outline>outline</a> of the entire document.</li>
@@ -11246,27 +11265,27 @@ isn't his only passion. He also enjoys other pleasures.&lt;/p&gt;
<p>Given the <a href=#outline>outline</a> of a document, but ignoring any
sections created for <code><a href=#the-nav-element>nav</a></code> and <code><a href=#the-aside-element>aside</a></code>
elements, and any of their descendants, if the only root of the tree
- is <a href=#the-body-element-1>the body element</a>'s <a href=#concept-section title=concept-section>section</a>, and it has only a single
+ is <a href=#the-body-element-0>the body element</a>'s <a href=#concept-section title=concept-section>section</a>, and it has only a single
subsection which is created by an <code><a href=#the-article-element>article</a></code> element, then
- the heading of <a href=#the-body-element-1>the body element</a> should be assumed to be
+ the heading of <a href=#the-body-element-0>the body element</a> should be assumed to be
a site-wide heading, and the heading of the <code><a href=#the-article-element>article</a></code>
element should be assumed to be the page's heading.</p>
<p>If a page starts with a heading that is common to the whole site,
the document must be authored such that, in the document's
<a href=#outline>outline</a>, ignoring any sections created for
<code><a href=#the-nav-element>nav</a></code> and <code><a href=#the-aside-element>aside</a></code> elements and any of their
- descendants, the tree has only one root <a href=#concept-section title=concept-section>section</a>, <a href=#the-body-element-1>the body
+ descendants, the tree has only one root <a href=#concept-section title=concept-section>section</a>, <a href=#the-body-element-0>the body
element</a>'s section, its heading is the site-wide heading,
- <a href=#the-body-element-1>the body element</a> has just one subsection, that
+ <a href=#the-body-element-0>the body element</a> has just one subsection, that
subsection is created by an <code><a href=#the-article-element>article</a></code> element, and that
<code><a href=#the-article-element>article</a></code>'s heading is the page heading.</p>
<p>If a page does not contain a site-wide heading, then the page
must be authored such that, in the document's <a href=#outline>outline</a>,
ignoring any sections created for <code><a href=#the-nav-element>nav</a></code> and
<code><a href=#the-aside-element>aside</a></code> elements and any of their descendants, either
- <a href=#the-body-element-1>the body element</a> has no subsections, or it has more
+ <a href=#the-body-element-0>the body element</a> has no subsections, or it has more
than one subsection, or it has a single subsection but that
subsection is not created by an <code><a href=#the-article-element>article</a></code> element, or
there is more than one <a href=#concept-section title=concept-section>section</a>
@@ -23049,7 +23068,7 @@ function AddCloud(data, x, y) { ... }</pre>
zero, then let <var title="">span</var> be that value.</p>
<p>Otherwise, if the <code><a href=#the-colgroup-element>colgroup</a></code> element has no
- <code title=attr-col-span><a href=#attr-col-span>span</a></code> attribute, or if
+ <code title=attr-colgroup-span><a href=#attr-colgroup-span>span</a></code> attribute, or if
trying to parse the attribute's value resulted in an error,
then let <var title="">span</var> be 1.</p>
@@ -39060,7 +39079,7 @@ user reload must be equivalent to .reload()
algorithm here.</li>
<li><p>If there is an <code><a href=#the-a-element>a</a></code> element in the DOM that has a
- <code title=attr-a-name>name</code> attribute whose value is
+ <code title=attr-a-name><a href=#attr-a-name>name</a></code> attribute whose value is
exactly equal to <i>fragid</i>, then the first such element in tree
order is <a href=#the-indicated-part-of-the-document>the indicated part of the document</a>; stop the
algorithm here.</li>
@@ -41769,7 +41788,7 @@ at the first element with the given ID must be treated as if it was cloned and r
<p>When an element is <i>focused</i>, key events received by the
document must be targeted at that element. There may be no element
focused; when no element is focused, key events received by the
- document must be targetted at <a href=#the-body-element-1>the body element</a>.</p>
+ document must be targetted at <a href=#the-body-element-0>the body element</a>.</p>
<p>User agents may track focus for each <a href=#browsing-context>browsing
context</a> or <code>Document</code> individually, or may support
@@ -41949,7 +41968,7 @@ at the first element with the given ID must be treated as if it was cloned and r
<p>The <dfn id=dom-document-activeelement title=dom-document-activeElement><code>activeElement</code></dfn>
attribute on <code>DocumentHTML</code> objects must return the
element in the document that is focused. If no element in the
- <code>Document</code> is focused, this must return <a href=#the-body-element-1>the body
+ <code>Document</code> is focused, this must return <a href=#the-body-element-0>the body
element</a>.</p>
<p>The <dfn id=dom-document-hasfocus title=dom-document-hasFocus><code>hasFocus()</code></dfn> method
@@ -42828,7 +42847,7 @@ http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSPr
<td><code title="">none</code></td>
<td>Continue the drag-and-drop operation</td>
<tr><td><dfn id=event-dragenter title=event-dragenter><code>dragenter</code></dfn></td>
- <td><a href=#immediate-user-selection>Immediate user selection</a> or <a href=#the-body-element-1>the body element</a></td>
+ <td><a href=#immediate-user-selection>Immediate user selection</a> or <a href=#the-body-element-0>the body element</a></td>
<td>&#10003; Bubbles</td>
<td>&#10003; Cancelable</td>
<td>Empty</td>
@@ -43094,12 +43113,12 @@ http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSPr
<li>
<p>Otherwise, if the <a href=#current-target-element>current target element</a> is
- not <a href=#the-body-element-1>the body element</a>, the user agent must fire a
+ not <a href=#the-body-element-0>the body element</a>, the user agent must fire a
<code title=event-dragenter><a href=#event-dragenter>dragenter</a></code> event at
- <a href=#the-body-element-1>the body element</a>, and the <a href=#current-target-element>current target
- element</a> must be set to <a href=#the-body-element-1>the body element</a>,
+ <a href=#the-body-element-0>the body element</a>, and the <a href=#current-target-element>current target
+ element</a> must be set to <a href=#the-body-element-0>the body element</a>,
regardless of whether that event was canceled or not. (If
- <a href=#the-body-element-1>the body element</a> is null, then the <a href=#current-target-element>current
+ <a href=#the-body-element-0>the body element</a> is null, then the <a href=#current-target-element>current
target element</a> would be set to null too in this case,
it wouldn't be set to the <code>Document</code> object.)</p>
@@ -47773,7 +47792,7 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
<code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-base-element>base</a></code>,
<code>basefont</code>, <code>bgsound</code>,
<code><a href=#the-blockquote-element>blockquote</a></code>, <code><a href=#the-body-element>body</a></code>, <code><a href=#the-br-element>br</a></code>,
- <code>center</code>, <code><a href=#the-col-element>col</a></code>, <code><a href=#the-colgroup-element>colgroup</a></code>,
+ <code><a href=#center>center</a></code>, <code><a href=#the-col-element>col</a></code>, <code><a href=#the-colgroup-element>colgroup</a></code>,
<code><a href=#the-command>command</a></code>, <code><a href=#datagrid>datagrid</a></code>, <code><a href=#the-dd-element>dd</a></code>,
<code><a href=#the-details-element>details</a></code>, <code><a href=#the-dialog-element>dialog</a></code>, <code>dir</code>,
<code><a href=#the-div-element>div</a></code>, <code><a href=#the-dl-element>dl</a></code>, <code><a href=#the-dt-element>dt</a></code>,
@@ -47800,7 +47819,7 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
<dd><p>The following HTML elements introduce new <a href=#has-an-element-in-scope title="has
an element in scope">scopes</a> for various parts of the
parsing: <code><a href=#the-applet-element>applet</a></code>, <code><a href=#the-button-element>button</a></code>,
- <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-html-element>html</a></code>, <code>marquee</code>,
+ <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-html-element>html</a></code>, <code><a href=#the-marquee-element-0>marquee</a></code>,
<code><a href=#the-object-element>object</a></code>, <code><a href=#the-table-element>table</a></code>, <code><a href=#the-td-element>td</a></code>,
<code><a href=#the-th-element>th</a></code><!--XXXSVG, and SVG's <code>foreignObject</code>-->.</dd>
@@ -47835,7 +47854,7 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
<li><code><a href=#the-td-element>td</a></code> in the HTML namespace</li>
<li><code><a href=#the-th-element>th</a></code> in the HTML namespace</li>
<li><code><a href=#the-button-element>button</a></code> in the HTML namespace</li>
- <li><code>marquee</code> in the HTML namespace</li>
+ <li><code><a href=#the-marquee-element-0>marquee</a></code> in the HTML namespace</li>
<li><code><a href=#the-object-element>object</a></code> in the HTML namespace</li>
<!--XXXSVG <li><code title="">foreignObject</code> in the SVG namespace</li>-->
</ul></li>
@@ -55690,24 +55709,288 @@ http://lxr.mozilla.org/seamonkey/search?string=nested
</ol><h2 id=rendering><span class=secno>10 </span>Rendering</h2>
- <!-- XXX
+ <p><em>This section all its subsections are non-normative.</em></p>
+
+ <h3 id=introduction-8><span class=secno>10.1 </span>Introduction</h3>
+
+ <p>User agents are not required present HTML documents in any
+ particular way. This section merely provides a set of suggestions
+ for rendering HTML documents that, if followed, are likely to lead
+ to a user experience that closely resembles the experience intended
+ by the documents' authors.</p>
+
+ <p>In general, user agents are expected to support CSS, and many of
+ the suggestions in this section are expressed in CSS terms. User
+ agents that use other presentation mechanisms can derive their
+ expected behavior by translating from the CSS rules given in this
+ section.</p>
+
+ <p>The suggestions in this section generally assume a visual output
+ medium with a resolution of 96dpi or greater, but HTML is intended
+ to apply to multiple media (it is a <i>media-independent</i>
+ language). User agents are encouraged to adapt the suggestions in
+ this section to their target media.</p>
+
+
+ <h3 id=hidden-elements><span class=secno>10.2 </span>Hidden elements</h3>
+
+ <p>User agents are expected to use the following styles in all
+ media.</p>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+[hidden], area, audio:not([controls]) base, basefont, command,
+datalist, eventsource, head, input[type=hidden], link,
+menu[type=context], meta, noembed, noframes, param, script, source,
+style, title { display: none; }</pre>
+
+ <p>This hides all the elements that do not represent anything
+ visible.</p>
+
+
+
+ <h3 id=visual-media-defaults><span class=secno>10.3 </span>Visual media defaults</h3>
+
+ <h4 id=introduction-9><span class=secno>10.3.1 </span>Introduction</h4>
+
+ <p>The CSS rules given in these subsections are expected to be used
+ as the defaults for all documents that contain <a href=#html-elements>HTML
+ elements</a> when presented in visual media.</p>
+
+ <p>Rules regarding left and right margins are given here as
+ appropriate for elements whose 'direction' property is 'ltr', and
+ are expected to be flipped around on elements whose 'direction'
+ property is 'rtl'.</p>
+
+ <p class=note>These rules are not a complete description of the
+ default rendering rules expected by legacy content at this time.</p>
+
+ <p class=XXX>Please send feedback if you can accurately describe
+ rules required by legacy content.</p>
+
+
+ <h4 id=display-types><span class=secno>10.3.2 </span>Display types</h4>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+address, article, aside, blockquote, body, center, dd, dialog, dir,
+div, dl, dt, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hr,
+html, layer, legend, listing, menu, multicol, nav, ol, p, plaintext,
+pre, section, ul, xmp { display: block; }
+
+table { display: table; }
+caption { display: table-caption; }
+colgroup { display: table-column-group; }
+col { display: table-column; }
+thead { display: table-header-group; }
+tbody { display: table-row-group; }
+tfoot { display: table-footer-group; }
+tr { display: table-row; }
+td, th { display: table-cell; }
+
+li { display: list-item; }</pre>
+
+ <!-- del, ins, and map are inline. -->
+
+ <p>For the purposes of the CSS table model, the <code><a href=#the-col-element>col</a></code>
+ element is to be treated as if it was present as many times as its
+ <code title=attr-col-span><a href=#attr-col-span>span</a></code> attribute <a href=#rules-for-parsing-non-negative-integers title="rules
+ for parsing non-negative integers">specifies</a>.</p>
+
+ <p>For the purposes of the CSS table model, the
+ <code><a href=#the-colgroup-element>colgroup</a></code> element, if it contains no <code><a href=#the-col-element>col</a></code>
+ element, is to be treated as if it had as many such children as its
+ <code title=attr-colgroup-span><a href=#attr-colgroup-span>span</a></code> attribute <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative
+ integers">specifies</a>.</p>
+
+ <p>For the purposes of the CSS table model, the <code title=attr-tdth-colspan><a href=#attr-tdth-colspan>colspan</a></code> and <code title=attr-tdth-rowspan><a href=#attr-tdth-rowspan>rowspan</a></code> attributes on
+ <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements are expected to provide
+ the <i>special knowledge</i> regarding cells spanning rows and
+ columns.</p>
+
+
+ <h4 id=margins-and-padding><span class=secno>10.3.3 </span>Margins and padding</h4>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+body { padding: 8px; }<!-- XXX or margin? -->
+
+blockquote, dir, dl, listing, menu, ol, p, plaintext, pre, ul, xmp {
+ margin-top: 1em; margin-bottom: 1em;
+}
+dir dir, dir dl, dir menu, dir ol, dir ul,
+dl dir, dl dl, dl menu, dl ol, dl ul,
+menu dir, menu dl, menu menu, menu ol, menu ul,
+ol dir, ol dl, ol menu, ol ol, ol ul,
+ul dir, ul dl, ul menu, ul ol, ul ul {
+ margin-top: 0; margin-bottom: 0;
+}
+
+dl &gt; dd { margin-left: 40px; } /* margin-right, for rtl elements */
+dir, menu, ol, ul { padding-left: 40px; } /* margin-right, for rtl elements */
+blockquote { margin-left: 40px; margin-right: 40px; }
+h1 { margin-left: 0.67em; margin-right; 0.67em; }
+h2 { margin-left: 0.83em; margin-right; 0.83em; }
+h3 { margin-left: 1.00em; margin-right; 1.00em; }
+h4 { margin-left: 1.33em; margin-right; 1.33em; }
+h5 { margin-left: 1.67em; margin-right; 1.67em; }
+h6 { margin-left: 2.33em; margin-right; 2.33em; }
+
+table { border-spacing: 2px; border-collapse: separate; }
+td, th { padding: 1px; }</pre>
+
+ <p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
+ expected to apply:</p>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+form { margin-bottom: 1em; }
+img[align=left] { margin-right: 3px; }
+img[align=right] { margin-left: 3px; }</pre>
+
+ <p>When a <code>Document</code> is in <a href=#quirks-mode>quirks mode</a>,
+ margins on <a href=#html-elements>HTML elements</a> that collapse with the top or
+ bottom of the initial containing block are expected to be collapsed
+ to zero.</p>
+
+
+ <h4 id=alignment><span class=secno>10.3.4 </span>Alignment</h4>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+thead, tbody, tfoot, table &gt; tr { vertical-align: middle; }
+tr, td, th { vertical-align: inherit; }
+table[align=left], img[align=left] { float: left; }
+table[align=right], img[align=right] { float: right; }
+th { text-align: center; }</pre>
- Rendering
+ <p>The <code><a href=#center>center</a></code> and <code><a href=#the-caption-element>caption</a></code> elements are
+ expected to center text within themselves, as if they had their
+ 'text-align' property set to 'center', and to center blocks and
+ tables within them, as their descendants had their horizontal
+ margins set to 'auto'.</p>
+
+
+ <h4 id=fonts-and-colors><span class=secno>10.3.5 </span>Fonts and colors</h4>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+:link, :visited { text-decoration: underline; }
+:link { color: blue; }
+:visited { color: purple; }
+address { font-style: italic; }
+body { color: black; background: white; }
+h1 { font-size: 2.00em; font-weight: bold; }
+h2 { font-size: 1.05em; font-weight: bold; }
+h3 { font-size: 1.17em; font-weight: bold; }
+h4 { font-size: 1.00em; font-weight: bold; }
+h5 { font-size: 0.83em; font-weight: bold; }
+h6 { font-size: 0.67em; font-weight: bold; }
+table { border-color: gray; }
+thead, tbody, tfoot, tr { border-color: inherit; }
+th { font-weight: bold; }
+listing, plaintext, pre, xmp { font-family: monospace; }</pre>
+
+
+ <h4 id=punctuation-and-decorations><span class=secno>10.3.6 </span>Punctuation and decorations</h4>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+q:before { content: open-quote; }
+q:after { content: close-quote; }
+
+listing, plaintext, pre, xmp { white-space: pre; }
+
+ol { list-style-type: decimal; }
+
+dir, menu, ul {
+ list-style-type: disc;
+}
+
+dir dl, dir menu, dir ul,
+menu dl, menu menu, menu ul,
+ol dl, ol menu, ol ul,
+ul dl, ul menu, ul ul {
+ list-style-type: circle;
+}
+
+dir dir dl, dir dir menu, dir dir ul,
+dir menu dl, dir menu menu, dir menu ul,
+dir ol dl, dir ol menu, dir ol ul,
+dir ul dl, dir ul menu, dir ul ul,
+menu dir dl, menu dir menu, menu dir ul,
+menu menu dl, menu menu menu, menu menu ul,
+menu ol dl, menu ol menu, menu ol ul,
+menu ul dl, menu ul menu, menu ul ul,
+ol dir dl, ol dir menu, ol dir ul,
+ol menu dl, ol menu menu, ol menu ul,
+ol ol dl, ol ol menu, ol ol ul,
+ol ul dl, ol ul menu, ol ul ul,
+ul dir dl, ul dir menu, ul dir ul,
+ul menu dl, ul menu menu, ul menu ul,
+ul ol dl, ul ol menu, ul ol ul,
+ul ul dl, ul ul menu, ul ul ul {
+ list-style-type: square;
+}
+
+iframe { border: 2px inset; }
+
+[dir=rtl] { direction: rtl; unicode-bidi: embed; }
+[dir=ltr] { direction: lrt; unicode-bidi: embed; }
+bdo[dir] { unicode-bidi: bidi-override; }</pre>
+
+ <p>In addition, rules setting the 'quotes' property appropriately
+ for the locales and languages understood by the user are expected to
+ be present.</p>
+
+
+
+ <h4 id=resetting-rules-for-inherited-properties><span class=secno>10.3.7 </span>Resetting rules for inherited properties</h4>
+
+ <p>The following rules are also expected to be in play, resetting
+ certain properties to block inheritance by default.</p>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+table { text-indent: initial; }</pre>
+
+ <p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
+ expected to apply:</p>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+table {
+ font-weight: initial;
+ font-style: initial;
+ font-variant: initial;
+ font-size: initial;
+ line-height: initial;
+ white-space: initial;
+ text-align: initial;
+}</pre>
+
+
+ <h3 id=form-controls-and-widgets><span class=secno>10.4 </span>Form controls and widgets</h3>
+
+ <p class=XXX>...</p>
+
+
+
+ <h3 id=self-contained-features><span class=secno>10.5 </span>Self-contained features</h3>
+
+ <h4 id=the-marquee-element><span class=secno>10.5.1 </span>The <code><a href=#the-marquee-element-0>marquee</a></code> element</h4>
+
+ <p class=XXX>...</p>
+
+
+ <h4 id=the-hr-element-0><span class=secno>10.5.2 </span>The <code><a href=#the-hr-element>hr</a></code> element</h4>
+
+ <p class=XXX>...</p>
+
+
+ <h3 id=other><span class=secno>10.6 </span>Other</h3>
+
+ <!-- XXX
- Default styling
- (have one paragraph or subsection per element)
- :link, :visited { }
- :link { }
- :visited { }
section { }
- p { }
- img { } - how to handle alt text, img in link (no border)...
mark { }
/* ... */
- Form Controls
- ...
-
Default UI
link: click
mark: skip to next mark element
@@ -55724,8 +56007,6 @@ http://lxr.mozilla.org/seamonkey/search?string=nested
for datagrid
...
-
-
> * note on rt rendering
>
> Since there are a number of documents with ruby but without rp, when you
@@ -55735,7 +56016,9 @@ http://lxr.mozilla.org/seamonkey/search?string=nested
> ::after) even when there are no rp elements. Otherwise, reading Web
> pages without rp is very annoying.
-
+ img - how to handle alt text, img in link (no border)... Define
+ that either the src="" is shown (as an image) or the alt="" is
+ shown (inline) but should not ever have both at once.
HIT TESTING TRANSPARENCY
@@ -55811,25 +56094,6 @@ target element as follows:
top border edge.</p> <!-- XXX horiz pos given bidi, and not
scrolling when not required to? -->
-<!-- Elements that have been dropped: ACRONYM B BASEFONT BLINK
-BIG CENTER DIR DIV FONT FRAME FRAMESET I ISINDEX MARQUEE NOEMBED
-NOFRAMES S SPACER STRIKE TT U -->
-
-<!-- XXX bits and pieces that were removed from the semantic parts:
-
- <p>In CSS-aware user agents, the default presentation of this
- element should be achieved by including the following rules, or
- their equivalent, in the UA's user agent style sheet:</p>
-
- <pre>@namespace xh url(http://www.w3.org/1999/xhtml);
-xh|section { display: block; margin: 1em 0; }</pre>
--->
-
-
-<!-- XXX alt="": Define that either the src="" is shown (as an image)
-or the alt="" is shown (inline) but should not ever have both at
-once. -->
-
<!--
<h4>Section headers</h4>
@@ -55852,7 +56116,6 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
-->
-
<p class=XXX> must define letting the user "<dfn id=obtain-a-physical-form>obtain a
physical form</dfn> (or a representation of a physical form)" of a
document (printing) and what this means for the UA, in particular
@@ -55863,15 +56126,14 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
are case-insensitive, as well as saying which attribute values must
be compared case-insensitively.</p>
-
<p class=XXX>Need to define the content attributes of BODY in
terms of CSS or something.</p>
- <h3 id=rendering-and-menus/toolbars><span class=secno>10.1 </span>Rendering and menus/toolbars</h3>
+ <h3 id=rendering-and-menus/toolbars><span class=secno>10.7 </span>Rendering and menus/toolbars</h3>
- <h4 id="the-'icon'-property"><span class=secno>10.1.1 </span>The 'icon' property</h4>
+ <h4 id="the-'icon'-property"><span class=secno>10.7.1 </span>The 'icon' property</h4>
<p>UAs should use the command's Icon as the default generic icon
provided by the user agent when the 'icon' property computes to
@@ -55888,42 +56150,69 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
section. They are documented to enable user agents to support legacy
content in an interoperable fashion.</p>
- <h3 id=obsolete-elements><span class=secno>11.1 </span>Obsolete elements</h3>
+<!-- XXX Elements that have been dropped: ACRONYM B BASEFONT BLINK BIG
+CENTER DIR DIV FONT FRAME FRAMESET I ISINDEX MARQUEE NOEMBED NOFRAMES
+S SPACER STRIKE TT U -->
+
+
+ <h3 id=self-contained-features-0><span class=secno>11.1 </span>Self-contained features</h3>
- <h4 id=the-body-element-0><span class=secno>11.1.1 </span>The <code><a href=#the-body-element>body</a></code> element</h4>
+ <h4 id=the-applet-element><span class=secno>11.1.1 </span>The <dfn><code>applet</code></dfn> element</h4>
+
+ <p>The <code><a href=#the-applet-element>applet</a></code> element is a Java-specific variant of the
+ <code><a href=#the-embed-element>embed</a></code> element. In HTML5 the <code><a href=#the-applet-element>applet</a></code> element
+ is obsoleted so that all extension frameworks (Java, .NET, Flash,
+ etc) are handled in a consistent manner.</p>
+
+ <p id=sandboxPluginApplet>If the <a href=#sandboxed-plugins-browsing-context-flag>sandboxed plugins browsing
+ context flag</a> is set on the <a href=#browsing-context>browsing context</a> for
+ which the <code><a href=#the-applet-element>applet</a></code> element's document is the <a href=#active-document>active
+ document</a>, then the element must be ignored (it represents
+ nothing).</p>
+
+ <p>Otherwise, <span class=XXX>define how the element works,
+ if supported</span>.</p>
<pre class=idl>[XXX] interface <a href=#htmldocument>HTMLDocument</a> {
- attribute DOMString <a href=#dom-document-fgcolor title=dom-document-fgColor>fgColor</a>;
- attribute DOMString <a href=#dom-document-bgcolor title=dom-document-bgColor>bgColor</a>;
- attribute DOMString <a href=#dom-document-linkcolor title=dom-document-linkColor>linkColor</a>;
- attribute DOMString <a href=#dom-document-vlinkcolor title=dom-document-vlinkColor>vlinkColor</a>;
- attribute DOMString <a href=#dom-document-alinkcolor title=dom-document-alinkColor>alinkColor</a>;
+ readonly attribute <a href=#htmlcollection-0>HTMLCollection</a> <a href=#dom-document-applets title=dom-document-applets>applets</a>;
};</pre>
- <p>The <dfn id=dom-document-fgcolor title=dom-document-fgColor><code>fgColor</code></dfn>
- attribute on the <code>Document</code> object must
- <a href=#reflect>reflect</a> the <code title=attr-body-text>text</code>
- attribute on <a href=#the-body-element-1>the body element</a>.</p>
+ <p>The <dfn id=dom-document-applets title=dom-document-applets><code>applets</code></dfn>
+ attribute must return an <code><a href=#htmlcollection-0>HTMLCollection</a></code> rooted at the
+ <code>Document</code> node, whose filter matches only
+ <code><a href=#the-applet-element>applet</a></code> elements.</p>
- <p>The <dfn id=dom-document-bgcolor title=dom-document-bgColor><code>bgColor</code></dfn>
- attribute on the <code>Document</code> object must
- <a href=#reflect>reflect</a> the <code title=attr-body-bgcolor>bgcolor</code>
- attribute on <a href=#the-body-element-1>the body element</a>.</p>
- <p>The <dfn id=dom-document-linkcolor title=dom-document-linkColor><code>linkColor</code></dfn>
- attribute on the <code>Document</code> object must
- <a href=#reflect>reflect</a> the <code title=attr-body-link>link</code>
- attribute on <a href=#the-body-element-1>the body element</a>.</p>
+ <h4 id=the-marquee-element-0><span class=secno>11.1.2 </span>The <dfn><code>marquee</code></dfn> element</h4>
- <p>The <dfn id=dom-document-vlinkcolor title=dom-document-vLinkColor><code>vLinkColor</code></dfn>
- attribute on the <code>Document</code> object must
- <a href=#reflect>reflect</a> the <code title=attr-body-vlink>vlink</code>
- attribute on <a href=#the-body-element-1>the body element</a>.</p>
+ <p class=XXX>...</p>
- <p>The <dfn id=dom-document-alinkcolor title=dom-document-aLinkColor><code>aLinkColor</code></dfn>
- attribute on the <code>Document</code> object must
- <a href=#reflect>reflect</a> the <code title=attr-body-alink>alink</code>
- attribute on <a href=#the-body-element-1>the body element</a>.</p>
+
+ <h3 id=other-elements-and-attributes><span class=secno>11.2 </span>Other elements and attributes</h3>
+
+ <p>The following elements are obsolete and either have no meaning
+ whatsoever or have no requirements beyond those described elsewhere
+ in this specification:</p>
+
+ <ul><li><dfn id=center><code>center</code></dfn></li>
+
+ </ul><hr><p>The following attributes are obsolete and either have no meaning
+ whatsoever or have no requirements beyond those described elsewhere
+ in this specification:</p>
+
+ <ul><li><dfn id=attr-a-name title=attr-a-name><code>name</code></dfn> on <code><a href=#the-a-element>a</a></code> elements</li>
+ <li><dfn id=attr-body-alink title=attr-body-alink><code>alink</code></dfn> on <code><a href=#the-body-element>body</a></code> elements</li>
+ <li><dfn id=attr-body-bgcolor title=attr-body-bgcolor><code>bgcolor</code></dfn> on <code><a href=#the-body-element>body</a></code> elements</li>
+ <li><dfn id=attr-body-link title=attr-body-link><code>link</code></dfn> on <code><a href=#the-body-element>body</a></code> elements</li>
+ <li><dfn id=attr-body-text title=attr-body-text><code>text</code></dfn> on <code><a href=#the-body-element>body</a></code> elements</li>
+ <li><dfn id=attr-body-vlink title=attr-body-vlink><code>vlink</code></dfn> on <code><a href=#the-body-element>body</a></code> elements</li>
+ </ul><h3 id=other-dom-apis><span class=secno>11.3 </span>Other DOM APIs</h3>
+
+ <p>These APIs expose obsolete content attributes.</p>
+
+ <p class=XXX>The [XXX] below is for some annotation meaning "this
+ is just another part of the named interface, and should be treated
+ as if it had been part of the main interface definition".</p>
<pre class=idl>[XXX] interface <a href=#htmlbodyelement>HTMLBodyElement</a> {
attribute DOMString <a href=#dom-body-text title=dom-body-text>text</a>;
@@ -55936,12 +56225,12 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
<p>The <dfn id=dom-body-text title=dom-body-text><code>text</code></dfn> DOM
attribute of the <code><a href=#the-body-element>body</a></code> element must <a href=#reflect>reflect</a>
- the element's <code title=attr-body-text>text</code> content
+ the element's <code title=attr-body-text><a href=#attr-body-text>text</a></code> content
attribute.</p>
<p>The <dfn id=dom-body-bgcolor title=dom-body-bgColor><code>bgColor</code></dfn> DOM
attribute of the <code><a href=#the-body-element>body</a></code> element must <a href=#reflect>reflect</a>
- the element's <code title=attr-body-bgcolor>bgcolor</code> content
+ the element's <code title=attr-body-bgcolor><a href=#attr-body-bgcolor>bgcolor</a></code> content
attribute.</p>
<p>The <dfn id=dom-body-background title=dom-body-background><code>background</code></dfn> DOM
@@ -55951,49 +56240,56 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
<p>The <dfn id=dom-body-link title=dom-body-link><code>link</code></dfn> DOM
attribute of the <code><a href=#the-body-element>body</a></code> element must <a href=#reflect>reflect</a>
- the element's <code title=attr-body-link>link</code> content
+ the element's <code title=attr-body-link><a href=#attr-body-link>link</a></code> content
attribute.</p>
<p>The <dfn id=dom-body-alink title=dom-body-aLink><code>aLink</code></dfn> DOM
attribute of the <code><a href=#the-body-element>body</a></code> element must <a href=#reflect>reflect</a>
- the element's <code title=attr-body-alink>alink</code> content
+ the element's <code title=attr-body-alink><a href=#attr-body-alink>alink</a></code> content
attribute.</p>
<p>The <dfn id=dom-body-vlink title=dom-body-vLink><code>vLink</code></dfn> DOM
attribute of the <code><a href=#the-body-element>body</a></code> element must <a href=#reflect>reflect</a>
- the element's <code title=attr-body-vlink>vlink</code> content
+ the element's <code title=attr-body-vlink><a href=#attr-body-vlink>vlink</a></code> content
attribute.</p>
+ <pre class=idl>[XXX] interface <a href=#htmldocument>HTMLDocument</a> {
+ attribute DOMString <a href=#dom-document-fgcolor title=dom-document-fgColor>fgColor</a>;
+ attribute DOMString <a href=#dom-document-bgcolor title=dom-document-bgColor>bgColor</a>;
+ attribute DOMString <a href=#dom-document-linkcolor title=dom-document-linkColor>linkColor</a>;
+ attribute DOMString <a href=#dom-document-vlinkcolor title=dom-document-vlinkColor>vlinkColor</a>;
+ attribute DOMString <a href=#dom-document-alinkcolor title=dom-document-alinkColor>alinkColor</a>;
+};</pre>
+ <p>The <dfn id=dom-document-fgcolor title=dom-document-fgColor><code>fgColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <a href=#reflect>reflect</a> the <code title=attr-body-text><a href=#attr-body-text>text</a></code>
+ attribute on <a href=#the-body-element-0>the body element</a>.</p>
- <h4 id=the-applet-element><span class=secno>11.1.2 </span>The <dfn><code>applet</code></dfn> element</h4>
-
- <p>The <code><a href=#the-applet-element>applet</a></code> element is a Java-specific variant of the
- <code><a href=#the-embed-element>embed</a></code> element. In HTML5 the <code><a href=#the-applet-element>applet</a></code> element
- is obsoleted so that all extension frameworks (Java, .NET, Flash,
- etc) are handled in a consistent manner.</p>
+ <p>The <dfn id=dom-document-bgcolor title=dom-document-bgColor><code>bgColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <a href=#reflect>reflect</a> the <code title=attr-body-bgcolor><a href=#attr-body-bgcolor>bgcolor</a></code>
+ attribute on <a href=#the-body-element-0>the body element</a>.</p>
- <p id=sandboxPluginApplet>If the <a href=#sandboxed-plugins-browsing-context-flag>sandboxed plugins browsing
- context flag</a> is set on the <a href=#browsing-context>browsing context</a> for
- which the <code><a href=#the-applet-element>applet</a></code> element's document is the <a href=#active-document>active
- document</a>, then the element must be ignored (it represents
- nothing).</p>
+ <p>The <dfn id=dom-document-linkcolor title=dom-document-linkColor><code>linkColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <a href=#reflect>reflect</a> the <code title=attr-body-link><a href=#attr-body-link>link</a></code>
+ attribute on <a href=#the-body-element-0>the body element</a>.</p>
- <p>Otherwise, <span class=XXX>define how the element works,
- if supported</span>.</p>
+ <p>The <dfn id=dom-document-vlinkcolor title=dom-document-vLinkColor><code>vLinkColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <a href=#reflect>reflect</a> the <code title=attr-body-vlink><a href=#attr-body-vlink>vlink</a></code>
+ attribute on <a href=#the-body-element-0>the body element</a>.</p>
- <pre class=idl>[XXX] interface <a href=#htmldocument>HTMLDocument</a> {
- readonly attribute <a href=#htmlcollection-0>HTMLCollection</a> <a href=#dom-document-applets title=dom-document-applets>applets</a>;
-};</pre>
+ <p>The <dfn id=dom-document-alinkcolor title=dom-document-aLinkColor><code>aLinkColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <a href=#reflect>reflect</a> the <code title=attr-body-alink><a href=#attr-body-alink>alink</a></code>
+ attribute on <a href=#the-body-element-0>the body element</a>.</p>
- <p>The <dfn id=dom-document-applets title=dom-document-applets><code>applets</code></dfn>
- attribute must return an <code><a href=#htmlcollection-0>HTMLCollection</a></code> rooted at the
- <code>Document</code> node, whose filter matches only
- <code><a href=#the-applet-element>applet</a></code> elements.</p>
- <h3 id=conformance-checkers-0><span class=secno>11.2 </span>Conformance checkers</h3>
+ <h3 id=conformance-checkers-0><span class=secno>11.4 </span>Conformance checkers</h3>
<p>To ease the transition from HTML4 Transitional documents to the
language defined in <em>this</em> specification, conformance
@@ -56054,7 +56350,7 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
<code><a href=#script>script</a></code> element if its value is an <a href=#ascii-case-insensitive>ASCII
case-insensitive</a> match for the string "<code title="">JavaScript</code>".</li>
- <li><p>The presence of a <code title=attr-a-name>name</code>
+ <li><p>The presence of a <code title=attr-a-name><a href=#attr-a-name>name</a></code>
attribute on an <code><a href=#the-a-element>a</a></code> element, if its value is not the
empty string.</li>
View
458 source
@@ -25467,7 +25467,7 @@ function AddCloud(data, x, y) { ... }</pre>
zero, then let <var title="">span</var> be that value.</p>
<p>Otherwise, if the <code>colgroup</code> element has no
- <code title="attr-col-span">span</code> attribute, or if
+ <code title="attr-colgroup-span">span</code> attribute, or if
trying to parse the attribute's value resulted in an error,
then let <var title="">span</var> be 1.</p>
@@ -60928,24 +60928,291 @@ http://lxr.mozilla.org/seamonkey/search?string=nested
<h2 id="rendering">Rendering</h2>
- <!-- XXX
+ <p><em>This section all its subsections are non-normative.</em></p>
+
+ <h3>Introduction</h3>
+
+ <p>User agents are not required present HTML documents in any
+ particular way. This section merely provides a set of suggestions
+ for rendering HTML documents that, if followed, are likely to lead
+ to a user experience that closely resembles the experience intended
+ by the documents' authors.</p>
+
+ <p>In general, user agents are expected to support CSS, and many of
+ the suggestions in this section are expressed in CSS terms. User
+ agents that use other presentation mechanisms can derive their
+ expected behavior by translating from the CSS rules given in this
+ section.</p>
+
+ <p>The suggestions in this section generally assume a visual output
+ medium with a resolution of 96dpi or greater, but HTML is intended
+ to apply to multiple media (it is a <i>media-independent</i>
+ language). User agents are encouraged to adapt the suggestions in
+ this section to their target media.</p>
+
+
+ <h3>Hidden elements</h3>
+
+ <p>User agents are expected to use the following styles in all
+ media.</p>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+[hidden], area, audio:not([controls]) base, basefont, command,
+datalist, eventsource, head, input[type=hidden], link,
+menu[type=context], meta, noembed, noframes, param, script, source,
+style, title { display: none; }</pre>
+
+ <p>This hides all the elements that do not represent anything
+ visible.</p>
+
+
+
+ <h3>Visual media defaults</h3>
+
+ <h4>Introduction</h4>
+
+ <p>The CSS rules given in these subsections are expected to be used
+ as the defaults for all documents that contain <span>HTML
+ elements</span> when presented in visual media.</p>
+
+ <p>Rules regarding left and right margins are given here as
+ appropriate for elements whose 'direction' property is 'ltr', and
+ are expected to be flipped around on elements whose 'direction'
+ property is 'rtl'.</p>
+
+ <p class="note">These rules are not a complete description of the
+ default rendering rules expected by legacy content at this time.</p>
+
+ <p class="XXX">Please send feedback if you can accurately describe
+ rules required by legacy content.</p>
+
+
+ <h4>Display types</h4>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+
+address, article, aside, blockquote, body, center, dd, dialog, dir,
+div, dl, dt, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hr,
+html, layer, legend, listing, menu, multicol, nav, ol, p, plaintext,
+pre, section, ul, xmp { display: block; }
+
+table { display: table; }
+caption { display: table-caption; }
+colgroup { display: table-column-group; }
+col { display: table-column; }
+thead { display: table-header-group; }
+tbody { display: table-row-group; }
+tfoot { display: table-footer-group; }
+tr { display: table-row; }
+td, th { display: table-cell; }
+
+li { display: list-item; }</pre>
+
+ <!-- del, ins, and map are inline. -->
+
+ <p>For the purposes of the CSS table model, the <code>col</code>
+ element is to be treated as if it was present as many times as its
+ <code title="attr-col-span">span</code> attribute <span title="rules
+ for parsing non-negative integers">specifies</span>.</p>
+
+ <p>For the purposes of the CSS table model, the
+ <code>colgroup</code> element, if it contains no <code>col</code>
+ element, is to be treated as if it had as many such children as its
+ <code title="attr-colgroup-span">span</code> attribute <span
+ title="rules for parsing non-negative
+ integers">specifies</span>.</p>
+
+ <p>For the purposes of the CSS table model, the <code
+ title="attr-tdth-colspan">colspan</code> and <code
+ title="attr-tdth-rowspan">rowspan</code> attributes on
+ <code>td</code> and <code>th</code> elements are expected to provide
+ the <i>special knowledge</i> regarding cells spanning rows and
+ columns.</p>
+
+
+ <h4>Margins and padding</h4>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+
+body { padding: 8px; }<!-- XXX or margin? -->
+
+blockquote, dir, dl, listing, menu, ol, p, plaintext, pre, ul, xmp {
+ margin-top: 1em; margin-bottom: 1em;
+}
+dir dir, dir dl, dir menu, dir ol, dir ul,
+dl dir, dl dl, dl menu, dl ol, dl ul,
+menu dir, menu dl, menu menu, menu ol, menu ul,
+ol dir, ol dl, ol menu, ol ol, ol ul,
+ul dir, ul dl, ul menu, ul ol, ul ul {
+ margin-top: 0; margin-bottom: 0;
+}
+
+dl > dd { margin-left: 40px; } /* margin-right, for rtl elements */
+dir, menu, ol, ul { padding-left: 40px; } /* margin-right, for rtl elements */
+blockquote { margin-left: 40px; margin-right: 40px; }
+h1 { margin-left: 0.67em; margin-right; 0.67em; }
+h2 { margin-left: 0.83em; margin-right; 0.83em; }
+h3 { margin-left: 1.00em; margin-right; 1.00em; }
+h4 { margin-left: 1.33em; margin-right; 1.33em; }
+h5 { margin-left: 1.67em; margin-right; 1.67em; }
+h6 { margin-left: 2.33em; margin-right; 2.33em; }
+
+table { border-spacing: 2px; border-collapse: separate; }
+td, th { padding: 1px; }</pre>
+
+ <p>In <span>quirks mode</span>, the following rules are also
+ expected to apply:</p>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+form { margin-bottom: 1em; }
+img[align=left] { margin-right: 3px; }
+img[align=right] { margin-left: 3px; }</pre>
+
+ <p>When a <code>Document</code> is in <span>quirks mode</span>,
+ margins on <span>HTML elements</span> that collapse with the top or
+ bottom of the initial containing block are expected to be collapsed
+ to zero.</p>
+
+
+ <h4>Alignment</h4>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+thead, tbody, tfoot, table > tr { vertical-align: middle; }
+tr, td, th { vertical-align: inherit; }
+table[align=left], img[align=left] { float: left; }
+table[align=right], img[align=right] { float: right; }
+th { text-align: center; }</pre>
+
+ <p>The <code>center</code> and <code>caption</code> elements are
+ expected to center text within themselves, as if they had their
+ 'text-align' property set to 'center', and to center blocks and
+ tables within them, as their descendants had their horizontal
+ margins set to 'auto'.</p>
+
+
+ <h4>Fonts and colors</h4>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+
+:link, :visited { text-decoration: underline; }
+:link { color: blue; }
+:visited { color: purple; }
+address { font-style: italic; }
+body { color: black; background: white; }
+h1 { font-size: 2.00em; font-weight: bold; }
+h2 { font-size: 1.05em; font-weight: bold; }
+h3 { font-size: 1.17em; font-weight: bold; }
+h4 { font-size: 1.00em; font-weight: bold; }
+h5 { font-size: 0.83em; font-weight: bold; }
+h6 { font-size: 0.67em; font-weight: bold; }
+table { border-color: gray; }
+thead, tbody, tfoot, tr { border-color: inherit; }
+th { font-weight: bold; }
+listing, plaintext, pre, xmp { font-family: monospace; }</pre>
+
+
+ <h4>Punctuation and decorations</h4>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+
+q:before { content: open-quote; }
+q:after { content: close-quote; }
- Rendering
+listing, plaintext, pre, xmp { white-space: pre; }
+
+ol { list-style-type: decimal; }
+
+dir, menu, ul {
+ list-style-type: disc;
+}
+
+dir dl, dir menu, dir ul,
+menu dl, menu menu, menu ul,
+ol dl, ol menu, ol ul,
+ul dl, ul menu, ul ul {
+ list-style-type: circle;
+}
+
+dir dir dl, dir dir menu, dir dir ul,
+dir menu dl, dir menu menu, dir menu ul,
+dir ol dl, dir ol menu, dir ol ul,
+dir ul dl, dir ul menu, dir ul ul,
+menu dir dl, menu dir menu, menu dir ul,
+menu menu dl, menu menu menu, menu menu ul,
+menu ol dl, menu ol menu, menu ol ul,
+menu ul dl, menu ul menu, menu ul ul,
+ol dir dl, ol dir menu, ol dir ul,
+ol menu dl, ol menu menu, ol menu ul,
+ol ol dl, ol ol menu, ol ol ul,
+ol ul dl, ol ul menu, ol ul ul,
+ul dir dl, ul dir menu, ul dir ul,
+ul menu dl, ul menu menu, ul menu ul,
+ul ol dl, ul ol menu, ul ol ul,
+ul ul dl, ul ul menu, ul ul ul {
+ list-style-type: square;
+}
+
+iframe { border: 2px inset; }
+
+[dir=rtl] { direction: rtl; unicode-bidi: embed; }
+[dir=ltr] { direction: lrt; unicode-bidi: embed; }
+bdo[dir] { unicode-bidi: bidi-override; }</pre>
+
+ <p>In addition, rules setting the 'quotes' property appropriately
+ for the locales and languages understood by the user are expected to
+ be present.</p>
+
+
+
+ <h4>Resetting rules for inherited properties</h4>
+
+ <p>The following rules are also expected to be in play, resetting
+ certain properties to block inheritance by default.</p>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+table { text-indent: initial; }</pre>
+
+ <p>In <span>quirks mode</span>, the following rules are also
+ expected to apply:</p>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+table {
+ font-weight: initial;
+ font-style: initial;
+ font-variant: initial;
+ font-size: initial;
+ line-height: initial;
+ white-space: initial;
+ text-align: initial;
+}</pre>
+
+
+ <h3>Form controls and widgets</h3>
+
+ <p class="XXX">...</p>
+
+
+
+ <h3>Self-contained features</h3>
+
+ <h4>The <code>marquee</code> element</h4>
+
+ <p class="XXX">...</p>
+
+
+ <h4>The <code>hr</code> element</h4>
+
+ <p class="XXX">...</p>
+
+
+ <h3>Other</h3>
+
+ <!-- XXX
- Default styling
- (have one paragraph or subsection per element)
- :link, :visited { }
- :link { }
- :visited { }
section { }
- p { }
- img { } - how to handle alt text, img in link (no border)...
mark { }
/* ... */
- Form Controls
- ...
-
Default UI
link: click
mark: skip to next mark element
@@ -60962,8 +61229,6 @@ http://lxr.mozilla.org/seamonkey/search?string=nested
for datagrid
...
-
-
> * note on rt rendering
>
> Since there are a number of documents with ruby but without rp, when you
@@ -60973,7 +61238,9 @@ http://lxr.mozilla.org/seamonkey/search?string=nested
> ::after) even when there are no rp elements. Otherwise, reading Web
> pages without rp is very annoying.
-
+ img - how to handle alt text, img in link (no border)... Define
+ that either the src="" is shown (as an image) or the alt="" is
+ shown (inline) but should not ever have both at once.
HIT TESTING TRANSPARENCY
@@ -61049,25 +61316,6 @@ target element as follows:
top border edge.</p> <!-- XXX horiz pos given bidi, and not
scrolling when not required to? -->
-<!-- Elements that have been dropped: ACRONYM B BASEFONT BLINK
-BIG CENTER DIR DIV FONT FRAME FRAMESET I ISINDEX MARQUEE NOEMBED
-NOFRAMES S SPACER STRIKE TT U -->
-
-<!-- XXX bits and pieces that were removed from the semantic parts:
-
- <p>In CSS-aware user agents, the default presentation of this
- element should be achieved by including the following rules, or
- their equivalent, in the UA's user agent style sheet:</p>
-
- <pre>@namespace xh url(http://www.w3.org/1999/xhtml);
-xh|section { display: block; margin: 1em 0; }</pre>
--->
-
-
-<!-- XXX alt="": Define that either the src="" is shown (as an image)
-or the alt="" is shown (inline) but should not ever have both at
-once. -->
-
<!--
<h4>Section headers</h4>
@@ -61090,7 +61338,6 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
-->
-
<p class="XXX"> must define letting the user "<dfn>obtain a
physical form</dfn> (or a representation of a physical form)" of a
document (printing) and what this means for the UA, in particular
@@ -61101,7 +61348,6 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
are case-insensitive, as well as saying which attribute values must
be compared case-insensitively.</p>
-
<p class="XXX">Need to define the content attributes of BODY in
terms of CSS or something.</p>
@@ -61126,42 +61372,79 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
section. They are documented to enable user agents to support legacy
content in an interoperable fashion.</p>
- <h3>Obsolete elements</h3>
+<!-- XXX Elements that have been dropped: ACRONYM B BASEFONT BLINK BIG
+CENTER DIR DIV FONT FRAME FRAMESET I ISINDEX MARQUEE NOEMBED NOFRAMES
+S SPACER STRIKE TT U -->
+
- <h4>The <code>body</code> element</h4>
+ <h3>Self-contained features</h3>
+
+ <h4>The <dfn><code>applet</code></dfn> element</h4>
+
+ <p>The <code>applet</code> element is a Java-specific variant of the
+ <code>embed</code> element. In HTML5 the <code>applet</code> element
+ is obsoleted so that all extension frameworks (Java, .NET, Flash,
+ etc) are handled in a consistent manner.</p>
+
+ <p id="sandboxPluginApplet">If the <span>sandboxed plugins browsing
+ context flag</span> is set on the <span>browsing context</span> for
+ which the <code>applet</code> element's document is the <span>active
+ document</span>, then the element must be ignored (it represents
+ nothing).</p>
+
+ <p>Otherwise, <span class="XXX">define how the element works,
+ if supported</span>.</p>
<pre class="idl">[XXX] interface <span>HTMLDocument</span> {
- attribute DOMString <span title="dom-document-fgColor">fgColor</span>;
- attribute DOMString <span title="dom-document-bgColor">bgColor</span>;
- attribute DOMString <span title="dom-document-linkColor">linkColor</span>;
- attribute DOMString <span title="dom-document-vlinkColor">vlinkColor</span>;
- attribute DOMString <span title="dom-document-alinkColor">alinkColor</span>;
+ readonly attribute <span>HTMLCollection</span> <span title="dom-document-applets">applets</span>;
};</pre>
- <p>The <dfn title="dom-document-fgColor"><code>fgColor</code></dfn>
- attribute on the <code>Document</code> object must
- <span>reflect</span> the <code title="attr-body-text">text</code>
- attribute on <span>the body element</span>.</p>
+ <p>The <dfn title="dom-document-applets"><code>applets</code></dfn>
+ attribute must return an <code>HTMLCollection</code> rooted at the
+ <code>Document</code> node, whose filter matches only
+ <code>applet</code> elements.</p>
- <p>The <dfn title="dom-document-bgColor"><code>bgColor</code></dfn>
- attribute on the <code>Document</code> object must
- <span>reflect</span> the <code title="attr-body-bgcolor">bgcolor</code>
- attribute on <span>the body element</span>.</p>
- <p>The <dfn title="dom-document-linkColor"><code>linkColor</code></dfn>
- attribute on the <code>Document</code> object must
- <span>reflect</span> the <code title="attr-body-link">link</code>
- attribute on <span>the body element</span>.</p>
+ <h4>The <dfn><code>marquee</code></dfn> element</h4>
- <p>The <dfn title="dom-document-vLinkColor"><code>vLinkColor</code></dfn>
- attribute on the <code>Document</code> object must
- <span>reflect</span> the <code title="attr-body-vlink">vlink</code>
- attribute on <span>the body element</span>.</p>
+ <p class="XXX">...</p>
- <p>The <dfn title="dom-document-aLinkColor"><code>aLinkColor</code></dfn>
- attribute on the <code>Document</code> object must
- <span>reflect</span> the <code title="attr-body-alink">alink</code>
- attribute on <span>the body element</span>.</p>
+
+ <h3>Other elements and attributes</h3>
+
+ <p>The following elements are obsolete and either have no meaning
+ whatsoever or have no requirements beyond those described elsewhere
+ in this specification:</p>
+
+ <ul>
+
+ <li><dfn><code>center</code></dfn></li>
+
+ </ul>
+
+ <hr>
+
+ <p>The following attributes are obsolete and either have no meaning
+ whatsoever or have no requirements beyond those described elsewhere
+ in this specification:</p>
+
+ <ul>
+ <li><dfn title="attr-a-name"><code>name</code></dfn> on <code>a</code> elements</li>
+ <li><dfn title="attr-body-alink"><code>alink</code></dfn> on <code>body</code> elements</li>
+ <li><dfn title="attr-body-bgcolor"><code>bgcolor</code></dfn> on <code>body</code> elements</li>
+ <li><dfn title="attr-body-link"><code>link</code></dfn> on <code>body</code> elements</li>
+ <li><dfn title="attr-body-text"><code>text</code></dfn> on <code>body</code> elements</li>
+ <li><dfn title="attr-body-vlink"><code>vlink</code></dfn> on <code>body</code> elements</li>
+ </ul>
+
+
+ <h3>Other DOM APIs</h3>
+
+ <p>These APIs expose obsolete content attributes.</p>
+
+ <p class="XXX">The [XXX] below is for some annotation meaning "this
+ is just another part of the named interface, and should be treated
+ as if it had been part of the main interface definition".</p>
<pre class="idl">[XXX] interface <span>HTMLBodyElement</span> {
attribute DOMString <span title="dom-body-text">text</span>;
@@ -61202,32 +61485,39 @@ xh|section xh|section xh|section xh|section xh|section xh|h1 { /* same styles as
the element's <code title="attr-body-vlink">vlink</code> content
attribute.</p>
+ <pre class="idl">[XXX] interface <span>HTMLDocument</span> {
+ attribute DOMString <span title="dom-document-fgColor">fgColor</span>;
+ attribute DOMString <span title="dom-document-bgColor">bgColor</span>;
+ attribute DOMString <span title="dom-document-linkColor">linkColor</span>;
+ attribute DOMString <span title="dom-document-vlinkColor">vlinkColor</span>;
+ attribute DOMString <span title="dom-document-alinkColor">alinkColor</span>;
+};</pre>
+ <p>The <dfn title="dom-document-fgColor"><code>fgColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <span>reflect</span> the <code title="attr-body-text">text</code>
+ attribute on <span>the body element</span>.</p>
- <h4>The <dfn><code>applet</code></dfn> element</h4>
-
- <p>The <code>applet</code> element is a Java-specific variant of the
- <code>embed</code> element. In HTML5 the <code>applet</code> element
- is obsoleted so that all extension frameworks (Java, .NET, Flash,
- etc) are handled in a consistent manner.</p>
+ <p>The <dfn title="dom-document-bgColor"><code>bgColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <span>reflect</span> the <code title="attr-body-bgcolor">bgcolor</code>
+ attribute on <span>the body element</span>.</p>
- <p id="sandboxPluginApplet">If the <span>sandboxed plugins browsing
- context flag</span> is set on the <span>browsing context</span> for
- which the <code>applet</code> element's document is the <span>active
- document</span>, then the element must be ignored (it represents
- nothing).</p>
+ <p>The <dfn title="dom-document-linkColor"><code>linkColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <span>reflect</span> the <code title="attr-body-link">link</code>
+ attribute on <span>the body element</span>.</p>
- <p>Otherwise, <span class="XXX">define how the element works,
- if supported</span>.</p>
+ <p>The <dfn title="dom-document-vLinkColor"><code>vLinkColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <span>reflect</span> the <code title="attr-body-vlink">vlink</code>
+ attribute on <span>the body element</span>.</p>
- <pre class="idl">[XXX] interface <span>HTMLDocument</span> {
- readonly attribute <span>HTMLCollection</span> <span title="dom-document-applets">applets</span>;
-};</pre>
+ <p>The <dfn title="dom-document-aLinkColor"><code>aLinkColor</code></dfn>
+ attribute on the <code>Document</code> object must
+ <span>reflect</span> the <code title="attr-body-alink">alink</code>
+ attribute on <span>the body element</span>.</p>
- <p>The <dfn title="dom-document-applets"><code>applets</code></dfn>
- attribute must return an <code>HTMLCollection</code> rooted at the
- <code>Document</code> node, whose filter matches only
- <code>applet</code> elements.</p>

0 comments on commit f186b43

Please sign in to comment.