- From: Ian Hickson via cvs-syncmail <cvsmail@w3.org>
- Date: Sat, 07 Feb 2009 00:21:57 +0000
- To: public-html-commits@w3.org
Update of /sources/public/html5/spec In directory hutz:/tmp/cvs-serv27576 Modified Files: Overview.html Log Message: Filling in the rendering section: the remaining <input> types -- all the buttons. (whatwg r2767) Index: Overview.html =================================================================== RCS file: /sources/public/html5/spec/Overview.html,v retrieving revision 1.1936 retrieving revision 1.1937 diff -u -d -r1.1936 -r1.1937 --- Overview.html 7 Feb 2009 00:09:19 -0000 1.1936 +++ Overview.html 7 Feb 2009 00:21:54 -0000 1.1937 @@ -980,15 +980,14 @@ <li><a href=#the-input-element-as-domain-specific-widgets><span class=secno>10.4.7 </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.8 </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.9 </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.10 </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.11 </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.12 </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.13 </span>The <code>input</code> element as a button</a></li> - <li><a href=#the-marquee-element><span class=secno>10.4.14 </span>The <code>marquee</code> element</a></li> - <li><a href=#the-meter-element-0><span class=secno>10.4.15 </span>The <code>meter</code> element</a></li> - <li><a href=#the-progress-element-0><span class=secno>10.4.16 </span>The <code>progress</code> element</a></li> - <li><a href=#the-select-element-0><span class=secno>10.4.17 </span>The <code>select</code> element</a></li> - <li><a href=#the-textarea-element-0><span class=secno>10.4.18 </span>The <code>textarea</code> element</a></ol></li> + <li><a href=#the-input-element-as-a-check-box-and-radio-button-widgets><span class=secno>10.4.10 </span>The <code>input</code> element as a check box and radio button widgets</a></li> + <li><a href=#the-input-element-as-a-file-upload-control><span class=secno>10.4.11 </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.12 </span>The <code>input</code> element as a button</a></li> + <li><a href=#the-marquee-element><span class=secno>10.4.13 </span>The <code>marquee</code> element</a></li> + <li><a href=#the-meter-element-0><span class=secno>10.4.14 </span>The <code>meter</code> element</a></li> + <li><a href=#the-progress-element-0><span class=secno>10.4.15 </span>The <code>progress</code> element</a></li> + <li><a href=#the-select-element-0><span class=secno>10.4.16 </span>The <code>select</code> element</a></li> + <li><a href=#the-textarea-element-0><span class=secno>10.4.17 </span>The <code>textarea</code> element</a></ol></li> <li><a href=#frames-and-framesets><span class=secno>10.5 </span>Frames and framesets</a></li> <li><a href=#interactive-media><span class=secno>10.6 </span>Interactive media</a> <ol> @@ -47204,30 +47203,30 @@ input[type=week] { binding: <i title="">input-week</i>; } input[type=time] { binding: <i title="">input-time</i>; } input[type=datetime-local] { binding: <i title="">input-datetime-local</i>; } -input[type=number] { binding: <i title="">input-number</i>; }</pre><p>When the <i title="">datetime</i> binding applies to an +input[type=number] { binding: <i title="">input-number</i>; }</pre><p>When the <i title="">input-datetime</i> binding applies to an <code><a href=#the-input-element>input</a></code> element whose <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> state, the element is expected to render as an 'inline-block' box depicting a - Date and Time control.<p>When the <i title="">date</i> binding applies to an + Date and Time control.<p>When the <i title="">input-date</i> binding applies to an <code><a href=#the-input-element>input</a></code> element whose <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#date-state title=attr-input-type-date>Date</a> state, the element is expected to render as an 'inline-block' box depicting a Date - control.<p>When the <i title="">month</i> binding applies to an + control.<p>When the <i title="">input-month</i> binding applies to an <code><a href=#the-input-element>input</a></code> element whose <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#month-state title=attr-input-type-month>Month</a> state, the element is expected to render as an 'inline-block' box depicting a Month - control.<p>When the <i title="">week</i> binding applies to an + control.<p>When the <i title="">input-week</i> binding applies to an <code><a href=#the-input-element>input</a></code> element whose <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#week-state title=attr-input-type-week>Week</a> state, the element is expected to render as an 'inline-block' box depicting a Week - control.<p>When the <i title="">time</i> binding applies to an + control.<p>When the <i title="">input-time</i> binding applies to an <code><a href=#the-input-element>input</a></code> element whose <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#time-state title=attr-input-type-time>Time</a> state, the element is expected to render as an 'inline-block' box depicting a Time - control.<p>When the <i title="">datetime-local</i> binding applies to an + control.<p>When the <i title="">input-datetime-local</i> binding applies to an <code><a href=#the-input-element>input</a></code> element whose <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#local-date-and-time-state title=attr-input-type-datetime-local>Local Date and Time</a> state, the element is expected to render as an 'inline-block' box - depicting a Local Date and Time control.<p>When the <i title="">number</i> binding applies to an + depicting a Local Date and Time control.<p>When the <i title="">input-number</i> binding applies to an <code><a href=#the-input-element>input</a></code> element whose <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#number-state title=attr-input-type-number>Number</a> state, the element is expected to render as an 'inline-block' box depicting a Number control.<p>These controls are all expected to be about one line high, and about as wide as necessary to show the widest possible value.<h4 id=the-input-element-as-a-range-control><span class=secno>10.4.8 </span>The <code><a href=#the-input-element>input</a></code> element as a range control</h4><pre class=css>@namespace url(http://www.w3.org/1999/xhtml); -input[type=range] { binding: <i title="">input-range</i>; }</pre><p>When the <i title="">datetime</i> binding applies to an +input[type=range] { binding: <i title="">input-range</i>; }</pre><p>When the <i title="">input-range</i> binding applies to an <code><a href=#the-input-element>input</a></code> element whose <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, the element is expected to render as an 'inline-block' box depicting a slider control.<p>When the control is wider than it is tall, the control is @@ -47237,14 +47236,37 @@ taller than it is wide, it is expected to be a vertical slider, with the lowest value on the top.<p>Predefined suggested values (provided by the <code title=attr-input-list><a href=#attr-input-list>list</a></code> attribute) are expected to be shown as tick marks on the slider, which the slider can snap to.<h4 id=the-input-element-as-a-color-well><span class=secno>10.4.9 </span>The <code><a href=#the-input-element>input</a></code> element as a color well</h4><pre class=css>@namespace url(http://www.w3.org/1999/xhtml); -input[type=color] { binding: <i title="">input-color</i>; }</pre><p>When the <i title="">datetime</i> binding applies to an +input[type=color] { binding: <i title="">input-color</i>; }</pre><p>When the <i title="">input-color</i> binding applies to an <code><a href=#the-input-element>input</a></code> element whose <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, the element is expected to render as an 'inline-block' box depicting a color well, which, when activated, provides the user with a color picker (e.g. a color wheel or color palette) from which the color can be changed.<p>Predefined suggested values (provided by the <code title=attr-input-list><a href=#attr-input-list>list</a></code> attribute) are expected to be shown in the color picker interface, not on the color well - itself.<h4 id=the-input-element-as-a-check-box-widget><span class=secno>10.4.10 </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.11 </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.12 </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>input</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.13 </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.14 </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=secno>10.4.15 </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.16 </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.17 </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.18 </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.5 </span>Frames and framesets</h3><p>When an <code><a href=#the-html-element>html</a></code> element's second child element is a + itself.<h4 id=the-input-element-as-a-check-box-and-radio-button-widgets><span class=secno>10.4.10 </span>The <code><a href=#the-input-element>input</a></code> element as a check box and radio button widgets</h4><pre class=css>@namespace url(http://www.w3.org/1999/xhtml); +input[type=checkbox] { binding: <i title="">input-checkbox</i>; } +input[type=radio] { binding: <i title="">input-radio</i>; }</pre><p>When the <i title="">input-checkbox</i> binding applies to an + <code><a href=#the-input-element>input</a></code> element whose <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, the element + is expected to render as an 'inline-block' box containing a single + check box control, with no label.<p>When the <i title="">input-radio</i> binding applies to an + <code><a href=#the-input-element>input</a></code> element whose <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, the element + is expected to render as an 'inline-block' box containing a single + radio button control, with no label.<h4 id=the-input-element-as-a-file-upload-control><span class=secno>10.4.11 </span>The <code><a href=#the-input-element>input</a></code> element as a file upload control</h4><pre class=css>@namespace url(http://www.w3.org/1999/xhtml); +input[type=file] { binding: <i title="">input-file</i>; }</pre><p>When the <i title="">input-file</i> binding applies to an + <code><a href=#the-input-element>input</a></code> element whose <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, the element + is expected to render as an 'inline-block' box containing a span of + text giving the filename(s) of the <a href=#concept-input-type-file-selected title=concept-input-type-file-selected>selected files</a>, if + any, followed by a button that, when activated, provides the user + with a file picker from which the selection can be changed.<h4 id=the-input-element-as-a-button><span class=secno>10.4.12 </span>The <code><a href=#the-input-element>input</a></code> element as a button</h4><pre class=css>@namespace url(http://www.w3.org/1999/xhtml); +input[type=submit], input[type=reset], input[type=button] { + binding: <i title="">input-button</i>; +}</pre><p>When the <i title="">input-button</i> binding applies to an + <code><a href=#the-input-element>input</a></code> element whose <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, the element is + expected to render as an 'inline-block' box rendered as a button, + about one line high, containing the contents of the element's <code title=attr-input-value><a href=#attr-input-value>value</a></code> attribute, if any, or text + derived from the element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> + attribute in a user-agent-defined (and probably locale-specific) + fashion, if not.<h4 id=the-marquee-element><span class=secno>10.4.13 </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=secno>10.4.14 </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.15 </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.16 </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.17 </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.5 </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
Received on Saturday, 7 February 2009 00:22:06 UTC