[html5] r3823 - [e] (0) <optgroup> example

[whatwg at whatwg.org]

Author: ianh
Date: 2009-09-13 02:35:41 -0700 (Sun, 13 Sep 2009)
New Revision: 3823

Modified:
   index
   source
Log:
[e] (0) <optgroup> example

Modified: index
===================================================================
--- index	2009-09-13 08:59:12 UTC (rev 3822)
+++ index	2009-09-13 09:35:41 UTC (rev 3823)
@@ -36211,7 +36211,37 @@
 
   </div>
 
+  <div class=example>
 
+   <p>The following snippet shows how a set of lessons from three
+   courses could be offered in a <code><a href=#the-select-element>select</a></code> drop-down
+   widget:</p>
+
+   <pre><form action="courseselector.dll" method="get">
+ <p>Which course would you like to watch today?
+ <p><label>Course:
+  <select name="c">
+   <optgroup label="8.01 Physics I: Classical Mechanics">
+    <option value="8.01.1">Lecture 01: Powers of Ten
+    <option value="8.01.2">Lecture 02: 1D Kinematics
+    <option value="8.01.3">Lecture 03: Vectors
+   <optgroup label="8.02 Electricity and Magnestism">
+    <option value="8.02.1">Lecture 01: What holds our world together?
+    <option value="8.02.2">Lecture 02: Electric Field
+    <option value="8.02.3">Lecture 03: Electric Flux
+   <optgroup label="8.03 Physics III: Vibrations and Waves">
+    <option value="8.03.1">Lecture 01: Periodic Phenomenon
+    <option value="8.03.2">Lecture 02: Beats
+    <option value="8.03.3">Lecture 03: Forced Oscillations with Damping
+  </select>
+ </label>
+ <p><input type=submit value="▶ Play">
+</form></pre>
+
+  </div>
+
+
+
   <h4 id=the-option-element><span class=secno>4.10.9 </span>The <dfn><code>option</code></dfn> element</h4>
 
   <dl class=element><dt>Categories</dt>

Modified: source
===================================================================
--- source	2009-09-13 08:59:12 UTC (rev 3822)
+++ source	2009-09-13 09:35:41 UTC (rev 3823)
@@ -40411,7 +40411,37 @@
 
   </div>
 
+  <div class="example">
 
+   <p>The following snippet shows how a set of lessons from three
+   courses could be offered in a <code>select</code> drop-down
+   widget:</p>
+
+   <pre><form action="courseselector.dll" method="get">
+ <p>Which course would you like to watch today?
+ <p><label>Course:
+  <select name="c">
+   <optgroup label="8.01 Physics I: Classical Mechanics">
+    <option value="8.01.1">Lecture 01: Powers of Ten
+    <option value="8.01.2">Lecture 02: 1D Kinematics
+    <option value="8.01.3">Lecture 03: Vectors
+   <optgroup label="8.02 Electricity and Magnestism">
+    <option value="8.02.1">Lecture 01: What holds our world together?
+    <option value="8.02.2">Lecture 02: Electric Field
+    <option value="8.02.3">Lecture 03: Electric Flux
+   <optgroup label="8.03 Physics III: Vibrations and Waves">
+    <option value="8.03.1">Lecture 01: Periodic Phenomenon
+    <option value="8.03.2">Lecture 02: Beats
+    <option value="8.03.3">Lecture 03: Forced Oscillations with Damping
+  </select>
+ </label>
+ <p><input type=submit value="&#x25B6; Play">
+</form></pre>
+
+  </div>
+
+
+
   <h4>The <dfn><code>option</code></dfn> element</h4>
 
   <dl class="element">