- From: Ian Hickson via cvs-syncmail <cvsmail@w3.org>
- Date: Thu, 05 Feb 2009 23:33:37 +0000
- To: public-html-commits@w3.org
Update of /sources/public/html5/spec
In directory hutz:/tmp/cvs-serv18489
Modified Files:
Overview.html
Log Message:
Filling in the rendering section: <bb>, <button>, <details>, and a rearranging of the sections with minor tweaks. (whatwg r2762)
Index: Overview.html
===================================================================
RCS file: /sources/public/html5/spec/Overview.html,v
retrieving revision 1.1931
retrieving revision 1.1932
diff -u -d -r1.1931 -r1.1932
--- Overview.html 5 Feb 2009 09:55:12 -0000 1.1931
+++ Overview.html 5 Feb 2009 23:33:35 -0000 1.1932
@@ -962,42 +962,47 @@
<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=#self-contained-features><span class=secno>10.4 </span>Self-contained features</a>
+ <li><a href=#replaced-elements><span class=secno>10.4 </span>Replaced elements</a>
<ol>
<li><a href=#embedded-content-1><span class=secno>10.4.1 </span>Embedded content</a></li>
- <li><a href=#frames><span class=secno>10.4.2 </span>Frames</a></li>
- <li><a href=#tool-bars-0><span class=secno>10.4.3 </span>Tool bars</a></li>
- <li><a href=#the-bb-element-0><span class=secno>10.4.4 </span>The <code>bb</code> element</a></li>
- <li><a href=#the-button-element-0><span class=secno>10.4.5 </span>The <code>button</code> element</a></li>
- <li><a href=#the-datagrid-element><span class=secno>10.4.6 </span>The <code>datagrid</code> element</a></li>
- <li><a href=#the-details-element-0><span class=secno>10.4.7 </span>The <code>details</code> element</a></li>
- <li><a href=#the-fieldset-element-0><span class=secno>10.4.8 </span>The <code>fieldset</code> element</a></li>
- <li><a href=#the-hr-element-0><span class=secno>10.4.9 </span>The <code>hr</code> element</a></li>
- <li><a href=#the-input-element-as-a-text-entry-widget><span class=secno>10.4.10 </span>The <code>input</code> element as a text entry widget</a></li>
- <li><a href=#the-input-element-as-domain-specific-widgets><span class=secno>10.4.11 </span>The <code>input</code> element as domain-specific widgets</a></li>
- <li><a href=#the-input-element-as-a-range-control><span class=secno>10.4.12 </span>The <code>input</code> element as a range control</a></li>
- <li><a href=#the-input-element-as-a-color-well><span class=secno>10.4.13 </span>The <code>input</code> element as a color well</a></li>
- <li><a href=#the-input-element-as-a-check-box-widget><span class=secno>10.4.14 </span>The <code>input</code> element as a check box widget</a></li>
- <li><a href=#the-input-element-as-a-radio-button-widget><span class=secno>10.4.15 </span>The <code>input</code> element as a radio button widget</a></li>
- <li><a href=#the-input-element-as-a-file-upload-control><span class=secno>10.4.16 </span>The <code>input</code> element as a file upload control</a></li>
- <li><a href=#the-input-element-as-a-button><span class=secno>10.4.17 </span>The <code>input</code> element as a button</a></li>
- <li><a href=#the-marquee-element><span class=secno>10.4.18 </span>The <code>marquee</code> element</a></li>
- <li><a href=#the-meter-element-0><span class=secno>10.4.19 </span>The <code>meter</code> element</a></li>
- <li><a href=#the-progress-element-0><span class=secno>10.4.20 </span>The <code>progress</code> element</a></li>
- <li><a href=#the-select-element-0><span class=secno>10.4.21 </span>The <code>select</code> element</a></li>
- <li><a href=#the-textarea-element-0><span class=secno>10.4.22 </span>The <code>textarea</code> element</a></li>
- <li><a href=#the-title-attribute-0><span class=secno>10.4.23 </span>The <code title=attr-title>title</code> attribute</a></ol></li>
- <li><a href=#interactive-media><span class=secno>10.5 </span>Interactive media</a>
+ <li><a href=#images-0><span class=secno>10.4.2 </span>Images</a></li>
+ <li><a href=#attributes-for-embedded-content-and-images><span class=secno>10.4.3 </span>Attributes for embedded content and images</a></li>
+ <li><a href=#tool-bars-0><span class=secno>10.4.4 </span>Tool bars</a></ol></li>
+ <li><a href=#bindings><span class=secno>10.5 </span>Bindings</a>
<ol>
- <li><a href=#hit-testing><span class=secno>10.5.1 </span>Hit testing</a></li>
- <li><a href=#links-0><span class=secno>10.5.2 </span>Links</a></li>
- <li><a href=#the-mark-element-0><span class=secno>10.5.3 </span>The <code>mark</code> element</a></li>
- <li><a href=#the-contenteditable-attribute><span class=secno>10.5.4 </span>The <code title=attr-contenteditable>contenteditable</code> attribute</a></ol></li>
- <li><a href=#print-media><span class=secno>10.6 </span>Print media</a></li>
- <li><a href=#interaction-with-css><span class=secno>10.7 </span>Interaction with CSS</a></ol></li>
+ <li><a href=#introduction-10><span class=secno>10.5.1 </span>Introduction</a></li>
+ <li><a href=#the-bb-element-0><span class=secno>10.5.2 </span>The <code>bb</code> element</a></li>
+ <li><a href=#the-button-element-0><span class=secno>10.5.3 </span>The <code>button</code> element</a></li>
+ <li><a href=#the-datagrid-element><span class=secno>10.5.4 </span>The <code>datagrid</code> element</a></li>
+ <li><a href=#the-details-element-0><span class=secno>10.5.5 </span>The <code>details</code> element</a></li>
+ <li><a href=#the-fieldset-element-0><span class=secno>10.5.6 </span>The <code>fieldset</code> element</a></li>
+ <li><a href=#the-hr-element-0><span class=secno>10.5.7 </span>The <code>hr</code> element</a></li>
+ <li><a href=#the-input-element-as-a-text-entry-widget><span class=secno>10.5.8 </span>The <code>input</code> element as a text entry widget</a></li>
+ <li><a href=#the-input-element-as-domain-specific-widgets><span class=secno>10.5.9 </span>The <code>input</code> element as domain-specific widgets</a></li>
+ <li><a href=#the-input-element-as-a-range-control><span class=secno>10.5.10 </span>The <code>input</code> element as a range control</a></li>
+ <li><a href=#the-input-element-as-a-color-well><span class=secno>10.5.11 </span>The <code>input</code> element as a color well</a></li>
+ <li><a href=#the-input-element-as-a-check-box-widget><span class=secno>10.5.12 </span>The <code>input</code> element as a check box widget</a></li>
+ <li><a href=#the-input-element-as-a-radio-button-widget><span class=secno>10.5.13 </span>The <code>input</code> element as a radio button widget</a></li>
+ <li><a href=#the-input-element-as-a-file-upload-control><span class=secno>10.5.14 </span>The <code>input</code> element as a file upload control</a></li>
+ <li><a href=#the-input-element-as-a-button><span class=secno>10.5.15 </span>The <code>input</code> element as a button</a></li>
+ <li><a href=#the-marquee-element><span class=secno>10.5.16 </span>The <code>marquee</code> element</a></li>
+ <li><a href=#the-meter-element-0><span class=secno>10.5.17 </span>The <code>meter</code> element</a></li>
+ <li><a href=#the-progress-element-0><span class=secno>10.5.18 </span>The <code>progress</code> element</a></li>
+ <li><a href=#the-select-element-0><span class=secno>10.5.19 </span>The <code>select</code> element</a></li>
+ <li><a href=#the-textarea-element-0><span class=secno>10.5.20 </span>The <code>textarea</code> element</a></ol></li>
+ <li><a href=#frames-and-framesets><span class=secno>10.6 </span>Frames and framesets</a></li>
+ <li><a href=#interactive-media><span class=secno>10.7 </span>Interactive media</a>
+ <ol>
+ <li><a href=#hit-testing><span class=secno>10.7.1 </span>Hit testing</a></li>
+ <li><a href=#links-0><span class=secno>10.7.2 </span>Links</a></li>
+ <li><a href=#the-mark-element-0><span class=secno>10.7.3 </span>The <code>mark</code> element</a></li>
+ <li><a href=#the-contenteditable-attribute><span class=secno>10.7.4 </span>The <code title=attr-contenteditable>contenteditable</code> attribute</a></li>
+ <li><a href=#the-title-attribute-0><span class=secno>10.7.5 </span>The <code title=attr-title>title</code> attribute</a></ol></li>
+ <li><a href=#print-media><span class=secno>10.8 </span>Print media</a></li>
+ <li><a href=#interaction-with-css><span class=secno>10.9 </span>Interaction with CSS</a></ol></li>
<li><a href=#obsolete-features><span class=secno>11 </span>Obsolete features</a>
<ol>
- <li><a href=#self-contained-features-0><span class=secno>11.1 </span>Self-contained features</a>
+ <li><a href=#self-contained-features><span class=secno>11.1 </span>Self-contained features</a>
<ol>
<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>
@@ -46270,9 +46275,11 @@
expected to render parentheses around the text of <code><a href=#the-rt-element>rt</a></code>
elements in the absence of <code><a href=#the-rp-element>rp</a></code> elements.<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);
-blockquote, dir, dl, listing, menu, ol, p, plaintext, pre, ul, xmp {
+article, aside, blockquote, dir, dl, figure, listing, menu, nav, ol,
+p, plaintext, pre, section, 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,
@@ -46912,9 +46919,17 @@
line-height: initial;
white-space: initial;
text-align: initial;
-}</pre><h3 id=self-contained-features><span class=secno>10.4 </span>Self-contained features</h3><h4 id=embedded-content-1><span class=secno>10.4.1 </span>Embedded content</h4><p>The <code><a href=#the-applet-element>applet</a></code>, <code><a href=#the-canvas-element>canvas</a></code>, <code><a href=#the-embed-element>embed</a></code>,
+}</pre><h3 id=replaced-elements><span class=secno>10.4 </span>Replaced elements</h3><h4 id=embedded-content-1><span class=secno>10.4.1 </span>Embedded content</h4><p>The <code><a href=#the-applet-element>applet</a></code>, <code><a href=#the-canvas-element>canvas</a></code>, <code><a href=#the-embed-element>embed</a></code>,
<code><a href=#the-iframe-element>iframe</a></code>, and <code><a href=#video>video</a></code> elements are expected to
- be treated as replaced elements.</p><hr><p>When an <code><a href=#the-img-element>img</a></code> element or an <code><a href=#the-input-element>input</a></code> element
+ be treated as replaced elements.<p>An <code><a href=#the-object-element>object</a></code> element that <a href=#represents>represents</a> an
+ image, plugin, or <a href=#nested-browsing-context>nested browsing context</a> is expected
+ to be treated as a replaced element. Other <code><a href=#the-object-element>object</a></code>
+ elements are expected to be treated as ordinary elements in the
+ rendering model.<p>The <code><a href=#audio>audio</a></code> element, when it has a <code title=attr-media-controls><a href=#attr-media-controls>controls</a></code> attribute, is expected
+ to be treated as a replaced element about one line high, as wide as
+ is necessary to expose the user agent's user interface features.</p><hr><p>The following CSS rules are expected to apply:<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+iframe { border: 2px inset; }</pre><h4 id=images-0><span class=secno>10.4.2 </span>Images</h4><p>When an <code><a href=#the-img-element>img</a></code> element or an <code><a href=#the-input-element>input</a></code> element
when its <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in
the <a href=#image-button-state title=attr-input-type-image>Image Button</a> state
<a href=#represents>represents</a> an image, it is expected to be treated as a
@@ -46956,15 +46971,11 @@
can be used to get to whatever options the UA provides for images,
and, where appropriate, are expected to provide access to the
context menu that would have come up if the user interacted with the
- actual image.</p><hr><p>An <code><a href=#the-object-element>object</a></code> element that <a href=#represents>represents</a> an
- image, plugin, or <a href=#nested-browsing-context>nested browsing context</a> is expected
- to be treated as a replaced element. Other <code><a href=#the-object-element>object</a></code>
- elements are expected to be treated as ordinary elements in the
- rendering model.</p><hr><p>The <code><a href=#audio>audio</a></code> element, when it has a <code title=attr-media-controls><a href=#attr-media-controls>controls</a></code> attribute, is expected
- to be treated as a replaced element about one line high, as wide as
- is necessary to expose the user agent's user interface features.</p><hr><p>The following CSS rules are expected to apply:<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+ actual image.</p><hr><p>The following CSS rules are expected to apply when the
+ <code>Document</code> is in <a href=#quirks-mode>quirks mode</a>:<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-iframe { border: 2px inset; }</pre><hr><p>The following CSS rules are expected to apply as
+img[align=left] { margin-right: 3px; }
+img[align=right] { margin-left: 3px; }</pre><h4 id=attributes-for-embedded-content-and-images><span class=secno>10.4.3 </span>Attributes for embedded content and images</h4><p>The following CSS rules are expected to apply as
<a href=#presentational-hints>presentational hints</a>:<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
iframe[frameborder=0], iframe[frameborder=no] { border: none; }
@@ -47040,11 +47051,73 @@
<code><a href=#the-img-element>img</a></code>, <code><a href=#the-object-element>object</a></code> or <code><a href=#video>video</a></code>
elements, and <code><a href=#the-input-element>input</a></code> elements with a <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute in the <a href=#image-button-state title=attr-input-type-image>Image Button</a> state, <a href=#maps-to-the-pixel-length-property title="maps to the pixel length property">map to the dimension
properties</a> 'width' and 'height' on the element
- respectively.</p><hr><p>The following CSS rules are expected to apply when the
- <code>Document</code> is in <a href=#quirks-mode>quirks mode</a>:<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+ respectively.<h4 id=tool-bars-0><span class=secno>10.4.4 </span>Tool bars</h4><p>When a <code><a href=#menus>menu</a></code> element's <code title=attr-menu-type><a href=#attr-menu-type>type</a></code> attribute is in the <a href=#tool-bar-state title="tool bar state">tool bar</a> state, the element is
+ expected to be treated as a replaced element with a height about two
+ lines high and a width derived from the contents of the element.<p>The element is expected to have, by default, the appearance of a
+ tool bar on the user agent's platform. It is expected to contain the
+ menu that is <a href=#building-menus-and-tool-bars title="building menus and tool bars">built</a>
+ from the element.<p class="example XXX">...example with screenshot...<h3 id=bindings><span class=secno>10.5 </span>Bindings</h3><h4 id=introduction-10><span class=secno>10.5.1 </span>Introduction</h4><p>A number of elements have their rendering defined in terms of the
+ 'binding' property. <a href=#references>[BECSS]</a><p>The CSS snippets below set the 'binding' property to a
+ user-agent-defined value, represented below by keywords like <code title=""><i><a href=#the-bb-element>bb</a></i></code>. The rules then described for these
+ bindings are only expected to apply if the element's 'binding'
+ property has not been overriden (e.g. by the author) to have another
+ value.<p>Exactly how the bindings are implemented is not specified by this
+ specification. User agents are encouraged to make their bindings set
+ the 'appearance' CSS property appropriately to achieve
+ platform-native appearances for widgets, and are expected to
+ implement any relevant animations, etc, that are appropriate for the
+ platform. <a href=#references>[CSSUI]</a><h4 id=the-bb-element-0><span class=secno>10.5.2 </span>The <code><a href=#the-bb-element>bb</a></code> element</h4><pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+bb:empty { binding: <i><a href=#the-bb-element>bb</a></i>; }</pre><p>When the <i><a href=#the-bb-element>bb</a></i> binding applies to a <code><a href=#the-bb-element>bb</a></code> element,
+ the element is expected to render as an 'inline-block' box rendered
+ as a button, about one line high, containing text derived from the
+ element's <code title=attr-bb-type><a href=#attr-bb-type>type</a></code> attribute in a
+ user-agent-defined (and probably locale-specific) fashion.<h4 id=the-button-element-0><span class=secno>10.5.3 </span>The <code><a href=#the-button-element>button</a></code> element</h4><pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+button { binding: <i><a href=#the-button-element>button</a></i>; }</pre><p>When the <i><a href=#the-button-element>button</a></i> binding applies to a <code><a href=#the-button-element>button</a></code>
+ element, the element is expected to render as an 'inline-block' box
+ rendered as a button whose contents are the contents of the
+ element.<h4 id=the-datagrid-element><span class=secno>10.5.4 </span>The <code><a href=#datagrid>datagrid</a></code> element</h4><p class=XXX>This section will probably include details on how to
+ render DATAGRID (including <span id=datagridPseudos>its
+ pseudo-elements</span>), drag-and-drop, etc, in a visual medium, in
+ concert with CSS. Implementation experience is desired before this
+ section is filled in.<h4 id=the-details-element-0><span class=secno>10.5.5 </span>The <code><a href=#the-details-element>details</a></code> element</h4><pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+details { binding: <i><a href=#the-details-element>details</a></i>; }</pre><p>When the <i><a href=#the-details-element>details</a></i> binding applies to a <code><a href=#the-details-element>details</a></code>
+ element, the element is expected to render as a 'block' box with its
+ 'padding-left' property set to '40px'. The element's shadow tree is
+ expected to take a child element that matches the selector <code title="">:bound-element > legend:first-child</code> and
+ place it in a first 'block' box container, and then take the
+ remaining child nodes and place them in a later 'block' box
+ container.<p>The first container is expected to contain at least one line box,
+ and that line box is expected to contain a triangle widget,
+ horizontally positioned within the left padding of the
+ <code><a href=#the-details-element>details</a></code> element. That widget is expected to allow the
+ user to request that the details be shown or hidden.<p>The later container is expected to have its 'overflow' property
+ set to 'hidden'. When the <code><a href=#the-details-element>details</a></code> element has an <code title=attr-details-open><a href=#attr-details-open>open</a></code> attribute, the later container
+ is expected to have its 'height' set to 'auto'; when it does not,
+ the later container is expected to have its 'height' set to 0.
-img[align=left] { margin-right: 3px; }
-img[align=right] { margin-left: 3px; }</pre><h4 id=frames><span class=secno>10.4.2 </span>Frames</h4><p>When an <code><a href=#the-html-element>html</a></code> element's second child element is a
+<!--
+XXX examples with screenshots
+http://mail.gnome.org/archives/usability/2006-June/msg00015.html
+want to show at least one that uses a triangle:
+
+ > No issues found
+ Viruses: 0
+ Trojans: 0
+
+...and one that uses a button widget instead of a triangle.
+-->
+
+
+
+ <h4 id=the-fieldset-element-0><span class=secno>10.5.6 </span>The <code><a href=#the-fieldset-element>fieldset</a></code> element</h4><p class=XXX>...</p><!-- XXX <legend align="left|right|center|bottom|top"> --><h4 id=the-hr-element-0><span class=secno>10.5.7 </span>The <code><a href=#the-hr-element>hr</a></code> element</h4><p class=XXX>...</p><!-- align=left|right|center (as auto margins), width=(int=>width:px; %->width:%)
+ color (color implies noshade); sets 'color' which then propagates to border-color; defaults to 'gray'
+ size=int, noshade
+ with noshade: border-width = size/2 (default size=2 => 1px per side); solid borders; rounded corners
+ without no shade: inset borders
+ without noshade, size>1: height = size-2; border-width=1px
+ without noshade, size=1: height = 0; border-top-width=1px only
+ --><h4 id=the-input-element-as-a-text-entry-widget><span class=secno>10.5.8 </span>The <code><a href=#the-input-element>input</a></code> element as a text entry widget</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#text-state-and-search-state title=attr-input-type-text>Text</a>, <a href=#text-state-and-search-state title=attr-input-type-search>Search</a>, <a href=#url-state title=attr-input-type-url>URL</a>, <a href=#e-mail-state title=attr-input-type-email>E-mail</a>, or <a href=#password-state title=attr-input-type-password>Password</a> state, ...</p><!-- datalist presentation --><!-- size: http://mxr.mozilla.org/mozilla-central/ident?i=CalcIntrinsicSize --><h4 id=the-input-element-as-domain-specific-widgets><span class=secno>10.5.9 </span>The <code><a href=#the-input-element>input</a></code> element as domain-specific widgets</h4><p class=XXX>When an <code><a href=#he-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#date-and-time-state title=attr-input-type-datetime>Date and Time</a>, <a href=#date-state title=attr-input-type-date>Date</a>, <a href=#month-state title=attr-input-type-month>Month</a>, <a href=#week-state title=attr-input-type-week>Week</a>, <a href=#time-state title=attr-input-type-time>Time</a>, <a href=#local-date-and-time-state title=attr-input-type-datetime-local>Local Date and Time</a> or
+ <a href=#number-state title=attr-input-type-number>Number</a> state...</p><!-- datalist presentation --><h4 id=the-input-element-as-a-range-control><span class=secno>10.5.10 </span>The <code><a href=#the-input-element>input</a></code> element as a range control</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#range-state title=attr-input-type-range>Range</a> state, ...</p><!-- datalist presentation --><h4 id=the-input-element-as-a-color-well><span class=secno>10.5.11 </span>The <code><a href=#the-input-element>input</a></code> element as a color well</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#color-state title=attr-input-type-color>Color</a> state, ...</p><!-- datalist presentation --><h4 id=the-input-element-as-a-check-box-widget><spa class=secno>10.5.12 </span>The <code><a href=#the-input-element>input</a></code> element as a check box widget</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#checkbox-state title=attr-input-type-checkbox>Checkbox</a> state, ...<h4 id=the-input-element-as-a-radio-button-widget><span class=secno>10.5.13 </span>The <code><a href=#the-input-element>input</a></code> element as a radio button widget</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#radio-button-state title=attr-input-type-radio>Radio Button</a> state, ...<h4 id=the-input-element-as-a-file-upload-control><span class=secno>10.5.14 </span>The <code><a href=#the-input-element>input</a></code> element as a file upload control</h4><p class=XXX>When an <code><a href=#the-input-element>inpt</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#file-upload-state title=attr-input-type-file>File Upload</a> state, ...<h4 id=the-input-element-as-a-button><span class=secno>10.5.15 </span>The <code><a href=#the-input-element>input</a></code> element as a button</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#submit-button-state title=attr-input-type-submit>Submit Button</a> <a href=#reset-button-state title=attr-input-type-reset>Reset Button</a>, or <a href=#button-state title=attr-input-type-button>Button</a> state, ...<h4 id=the-marquee-element><span class=secno>10.5.16 </span>The <code><a href=#the-marquee-element-0>marquee</a></code> element</h4><p class=XXX>...</p><!-- XXX attributes: height/width; direction is case insensitive; bgcolor; hspace/vspace --><h4 id=the-meter-element-0><span class=secn>10.5.17 </span>The <code><a href=#the-meter-element>meter</a></code> element</h4><p class=XXX>...<h4 id=the-progress-element-0><span class=secno>10.5.18 </span>The <code><a href=#the-progress-element>progress</a></code> element</h4><p class=XXX>...<h4 id=the-select-element-0><span class=secno>10.5.19 </span>The <code><a href=#the-select-element>select</a></code> element</h4><p class=XXX>...</p><!-- multiple, size; optgroup --><h4 id=the-textarea-element-0><span class=secno>10.5.20 </span>The <code><a href=#the-textarea-element>textarea</a></code> element</h4><p class=XXX>...<h3 id=frames-and-framesets><span class=secno>10.6 </span>Frames and framesets</h3><p>When an <code><a href=#the-html-element>html</a></code> element's second child element is a
<code>frameset</code> element, the user agent is expected to render
the <code>frameset</code> element as described below across the
surface of the <a href=#view>view</a>, instead of applying the usual CSS
@@ -47312,48 +47385,7 @@
proportionally) to each entry whose unit is <i>percentage</i>, then
equally (not proportionally) to each entry whose unit is
<i>absolute</i>, and finally, failing all else, to the last
- entry.<h4 id=tool-bars-0><span class=secno>10.4.3 </span>Tool bars</h4><p>When a <code><a href=#menus>menu</a></code> element's <code title=attr-menu-type><a href=#attr-menu-type>type</a></code> attribute is in the <a href=#tool-bar-state title="tool bar state">tool bar</a> state, the element is
- expected to be treated as a replaced element with a height about two
- lines high and a width derived from the contents of the element.<p>The element is expected to have, by default, the appearance of a
- tool bar on the user agent's platform. It is expected to contain the
- menu that is <a href=#building-menus-and-tool-bars title="building menus and tool bars">built</a>
- from the element.<p class="example XXX">...example with screenshot...<h4 id=the-bb-element-0><span class=secno>10.4.4 </span>The <code><a href=#the-bb-element>bb</a></code> element</h4><p>When the <code><a href=#the-bb-element>bb</a></code> element <a href=#represents>represents</a> a
- browser button, it is expected to render as a replaced element
- consisting of a regular one-line-high button, with a width based on
- the text in the button, which is itself based on its <code title=attr-bb-type><a href=#attr-bb-type>type</a></code> attribute in a user-agent-defined
- (and probably locale-specific) fashion. When it does not, it is
- expected to render as per the regular CSS rules.<h4 id=the-button-element-0><span class=secno>10.4.5 </span>The <code><a href=#the-button-element>button</a></code> element</h4><p>The <code><a href=#the-button-element>button</a></code> element is expected to render as a
- replaced element whose contents are styled as per the regular CSS
- rules. Its intrinisic dimensions are the shrink-wrap dimensions of
- its contents.<h4 id=the-datagrid-element><span class=secno>10.4.6 </span>The <code><a href=#datagrid>datagrid</a></code> element</h4><p class=XXX>This section will probably include details on how to
- render DATAGRID (including <span id=datagridPseudos>its
- pseudo-elements</span>), drag-and-drop, etc, in a visual medium, in
- concert with CSS. Implementation experience is desired before this
- section is filled in.<h4 id=the-details-element-0><span class=secno>10.4.7 </span>The <code><a href=#the-details-element>details</a></code> element</h4><p class=XXX>The <code><a href=#the-details-element>details</a></code> element, ...<p class=XXX>Basically CSS :open and :closed match the
- element, it's a block-level element by default, and when it matches
- :closed it renders as if it had an XBL binding attached to it whose
- template was just <code><template>▶<content
- includes="legend:first-child">Details</content></template></code>,
- and when it's :open it acts as if it had an XBL binding attached to
- it whose template was just <code><template>▼<content
- includes="legend:first-child">Details</content><content/></template></code>
- or some such.</p><!--
-Example ideas:
-http://mail.gnome.org/archives/usability/2006-June/msg00015.html
---><h4 id=the-fieldset-element-0><span class=secno>10.4.8 </span>The <code><a href=#the-fieldset-element>fieldset</a></code> element</h4><p class=XXX>...</p><!-- XXX <legend align="left|right|center|bottom|top"> --><h4 id=the-hr-element-0><span class=secno>10.4.9 </span>The <code><a href=#the-hr-element>hr</a></code> element</h4><p class=XXX>...</p><!-- align=left|right|center (as auto margins), width=(int=>width:px; %->width:%)
- color (color implies noshade); sets 'color' which then propagates to border-color; defaults to 'gray'
- size=int, noshade
- with noshade: border-width = size/2 (default size=2 => 1px per side); solid borders; rounded corners
- without no shade: inset borders
- without noshade, size>1: height = size-2; border-width=1px
- without noshade, size=1: height = 0; border-top-width=1px only
- --><h4 id=the-input-element-as-a-text-entry-widget><span class=secno>10.4.10 </span>The <code><a href=#the-input-element>input</a></code> element as a text entry widget</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#text-state-and-search-state title=attr-input-type-text>Text</a>, <a href=#text-state-and-search-state title=attr-input-type-search>Search</a>, <a href=#url-state title=attr-input-type-url>URL</a>, <a href=#e-mail-state title=attr-input-type-email>E-mail</a>, or <a href=#password-state title=attr-input-type-password>Password</a> state, ...</p><!-- datalist presentation --><!-- size: http://mxr.mozilla.org/mozilla-central/ident?i=CalcIntrinsicSize --><h4 id=the-input-element-as-domain-specific-widgets><span class=secno>10.4.11 </span>The <code><a href=#the-input-element>input</a></code> element as domain-specific widgets</h4><p class=XXX>When an <code><a href#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#date-and-time-state title=attr-input-type-datetime>Date and Time</a>, <a href=#date-state title=attr-input-type-date>Date</a>, <a href=#month-state title=attr-input-type-month>Month</a>, <a href=#week-state title=attr-input-type-week>Week</a>, <a href=#time-state title=attr-input-type-time>Time</a>, <a href=#local-date-and-time-state title=attr-input-type-datetime-local>Local Date and Time</a> or
- <a href=#number-state title=attr-input-type-number>Number</a> state...</p><!-- datalist presentation --><h4 id=the-input-element-as-a-range-control><span class=secno>10.4.12 </span>The <code><a href=#the-input-element>input</a></code> element as a range control</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#range-state title=attr-input-type-range>Range</a> state, ...</p><!-- datalist presentation --><h4 id=the-input-element-as-a-color-well><span class=secno>10.4.13 </span>The <code><a href=#the-input-element>input</a></code> element as a color well</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#color-state title=attr-input-type-color>Color</a> state, ...</p><!-- datalist presentation --><h4 id=the-input-element-as-a-check-box-widget><spa class=secno>10.4.14 </span>The <code><a href=#the-input-element>input</a></code> element as a check box widget</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#checkbox-state title=attr-input-type-checkbox>Checkbox</a> state, ...<h4 id=the-input-element-as-a-radio-button-widget><span class=secno>10.4.15 </span>The <code><a href=#the-input-element>input</a></code> element as a radio button widget</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#radio-button-state title=attr-input-type-radio>Radio Button</a> state, ...<h4 id=the-input-element-as-a-file-upload-control><span class=secno>10.4.16 </span>The <code><a href=#the-input-element>input</a></code> element as a file upload control</h4><p class=XXX>When an <code><a href=#the-input-element>inpt</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#file-upload-state title=attr-input-type-file>File Upload</a> state, ...<h4 id=the-input-element-as-a-button><span class=secno>10.4.17 </span>The <code><a href=#the-input-element>input</a></code> element as a button</h4><p class=XXX>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#submit-button-state title=attr-input-type-submit>Submit Button</a> <a href=#reset-button-state title=attr-input-type-reset>Reset Button</a>, or <a href=#button-state title=attr-input-type-button>Button</a> state, ...<h4 id=the-marquee-element><span class=secno>10.4.18 </span>The <code><a href=#the-marquee-element-0>marquee</a></code> element</h4><p class=XXX>...</p><!-- XXX attributes: height/width; direction is case insensitive; bgcolor; hspace/vspace --><h4 id=the-meter-element-0><span class=secn>10.4.19 </span>The <code><a href=#the-meter-element>meter</a></code> element</h4><p class=XXX>...<h4 id=the-progress-element-0><span class=secno>10.4.20 </span>The <code><a href=#the-progress-element>progress</a></code> element</h4><p class=XXX>...<h4 id=the-select-element-0><span class=secno>10.4.21 </span>The <code><a href=#the-select-element>select</a></code> element</h4><p class=XXX>...</p><!-- multiple, size; optgroup --><h4 id=the-textarea-element-0><span class=secno>10.4.22 </span>The <code><a href=#the-textarea-element>textarea</a></code> element</h4><p class=XXX>...<h4 id=the-title-attribute-0><span class=secno>10.4.23 </span>The <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute</h4><p>Given an element (e.g. the element designated by the mouse
- cursor), if the element, or one of its ancestors, has a <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute, and the nearest such
- attribute has a value that is not the empty string, it is expected
- that the user agent will expose the contents of that attribute as a
- tooltip.<p>U+000A LINE FEED (LF) characters are expected to cause line
- breaks in the tooltip.<h3 id=interactive-media><span class=secno>10.5 </span>Interactive media</h3><h4 id=hit-testing><span class=secno>10.5.1 </span>Hit testing</h4><p class=XXX>this should really be in a CSS spec -- hot to decide
+ entry.<h3 id=interactive-media><span class=secno>10.7 </span>Interactive media</h3><h4 id=hit-testing><span class=secno>10.7.1 </span>Hit testing</h4><p class=XXX>this should really be in a CSS spec -- hot to decide
which element is under the cursor -->
<!--
@@ -47422,14 +47454,19 @@
- <h4 id=links-0><span class=secno>10.5.2 </span>Links</h4><p class=XXX>...</p><!-- hyperlinks: hover show url; clicks; opening in new browsing contexts --><!-- cite attribute on q, blockquote, ins, del: on hover, show link --><h4 id=the-mark-element-0><span class=secno>10.5.3 </span>The <code><a href=#the-mark-element>mark</a></code> element</h4><p class=XXX>...</p><!-- being able to cycle through them --><!-- showing them on the scroll bar --><p class=XXX>The rendering section will eventually suggest
+ <h4 id=links-0><span class=secno>10.7.2 </span>Links</h4><p class=XXX>...</p><!-- hyperlinks: hover show url; clicks; opening in new browsing contexts --><!-- cite attribute on q, blockquote, ins, del: on hover, show link --><h4 id=the-mark-element-0><span class=secno>10.7.3 </span>The <code><a href=#the-mark-element>mark</a></code> element</h4><p class=XXX>...</p><!-- being able to cycle through them --><!-- showing them on the scroll bar --><p class=XXX>The rendering section will eventually suggest
that user agents provide a way to let users jump between
<code><a href=#the-mark-element>mark</a></code> elements. Suggested rendering is a neon yellow
background highlight, though UAs maybe should allow this to be
- toggled.<h4 id=the-contenteditable-attribute><span class=secno>10.5.4 </span>The <code title=attr-contenteditable><a href=#attr-contenteditable>contenteditable</a></code> attribute</h4><p class=XXX>...<h3 id=print-media><span class=secno>10.6 </span>Print media</h3><p class=XXX> must define letting the user "<dfn id=obtain-a-physical-form>obtain a
+ toggled.<h4 id=the-contenteditable-attribute><span class=secno>10.7.4 </span>The <code title=attr-contenteditable><a href=#attr-contenteditable>contenteditable</a></code> attribute</h4><p class=XXX>...<h4 id=the-title-attribute-0><span class=secno>10.7.5 </span>The <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute</h4><p>Given an element (e.g. the element designated by the mouse
+ cursor), if the element, or one of its ancestors, has a <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute, and the nearest such
+ attribute has a value that is not the empty string, it is expected
+ that the user agent will expose the contents of that attribute as a
+ tooltip.<p>U+000A LINE FEED (LF) characters are expected to cause line
+ breaks in the tooltip.<h3 id=print-media><span class=secno>10.8 </span>Print media</h3><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
- creating a new view for the print media.<h3 id=interaction-with-css><span class=secno>10.7 </span>Interaction with CSS</h3><!-- XXX this should be normative, so we'll have to move it out of
+ creating a new view for the print media.<h3 id=interaction-with-css><span class=secno>10.9 </span>Interaction with CSS</h3><!-- XXX this should be normative, so we'll have to move it out of
this section --><p class=XXX>Must define that in CSS, tag and attribute
names in HTML documents, and class names in quirks mode documents,
are case-insensitive, as well as saying which attribute values must
@@ -47447,7 +47484,7 @@
section. They are documented to enable user agents to support legacy
content in an interoperable fashion.</p><!-- 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-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
+S SPACER STRIKE TT U --><h3 id=self-contained-features><span class=secno>11.1 </span>Self-contained features</h3><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 id=sandboxPluginApplet>If the <a href=#sandboxed-plugins-browsing-context-flag>sandboxed plugins browsing
Received on Thursday, 5 February 2009 23:33:49 UTC