projects / xhtml11_quickref.git / blobdiff
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
Make the code validate again.
[xhtml11_quickref.git] / xhtml11_quick_reference_by_examples.html
diff --git a/xhtml11_quick_reference_by_examples.html b/xhtml11_quick_reference_by_examples.html
index d8d1855..e3522ad 100644 (file)
--- a/xhtml11_quick_reference_by_examples.html
+++ b/xhtml11_quick_reference_by_examples.html
@@ -6,7 +6,7 @@
      xsi:schemaLocation="http://www.w3.org/MarkUp/SCHEMA/xhtml11.xsd"
      xml:lang="en">
 <head>
      xsi:schemaLocation="http://www.w3.org/MarkUp/SCHEMA/xhtml11.xsd"
      xml:lang="en">
 <head>
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
 
   <title>XHTML 1.1 Quick Reference by examples</title>
 
 
   <title>XHTML 1.1 Quick Reference by examples</title>
 
@@ -22,6 +22,7 @@
   -->
 
   <style type="text/css">
   -->
 
   <style type="text/css">
+  /*<![CDATA[*/
 
 .red {
 color: red;
 
 .red {
 color: red;
@@ -136,15 +137,16 @@ noscript {}
 script {}
 */
 
 script {}
 */
 
+  /*]]>*/
   </style>
 
 </head>
 
 <body>
 <h1>XHTML 1.1 Quick Reference by examples</h1>
   </style>
 
 </head>
 
 <body>
 <h1>XHTML 1.1 Quick Reference by examples</h1>
-<a id="top" />
 
 
-<p>This page offers a quick reference by examples of all the elements specified by the <a title="eXtensible
+<p><a id="top" />
+This page offers a quick reference by examples of all the elements specified by the <a title="eXtensible
 Hypertext Markup language 1.1"
 href="http://www.w3.org/TR/xhtml11/">XHTML 1.1</a> W3C standard.</p>
 
 Hypertext Markup language 1.1"
 href="http://www.w3.org/TR/xhtml11/">XHTML 1.1</a> W3C standard.</p>
 
@@ -360,16 +362,20 @@ of the <strong>Text Module</strong>.
 
 <h3>Structure Module</h3>
 
 
 <h3>Structure Module</h3>
 
+<p>
   We don't show explicit examples for elements in the
   Structure module because they are Singleton elements, already used for the
   structure of this very page. Although you can style the <code>body</code> 
   and <code>html</code>
   elements.
   We don't show explicit examples for elements in the
   Structure module because they are Singleton elements, already used for the
   structure of this very page. Although you can style the <code>body</code> 
   and <code>html</code>
   elements.
+</p>
 
 <h3>Text module</h3>
 
 
 <h3>Text module</h3>
 
+<p>
 The Text module elements can be used inside a text to enrich it semantically.
 They are all style-able.
 The Text module elements can be used inside a text to enrich it semantically.
 They are all style-able.
+</p>
 
 <dl class="examples">
   <dt>abbr</dt>
 
 <dl class="examples">
   <dt>abbr</dt>
@@ -386,15 +392,19 @@ They are all style-able.
 
   <dt>address</dt>
   <dd>
 
   <dt>address</dt>
   <dd>
-  Antonio is from
-  <address>Naples, Italy</address>
-  a strange, still beautiful, city.
+  <address>
+  Antonio is from<br/>
+  <a title="Naples, Italy" 
+    href="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=it&amp;geocode=&amp;q=naples,+IT&amp;sll=26.160677,-81.795616&amp;sspn=0.137744,0.265045&amp;ie=UTF8&amp;ll=40.869911,14.252701&amp;spn=0.232099,0.53009&amp;z=11&amp;iwloc=A">Naples, Italy</a>,
+  a strange, still beautiful, city.<br/>
+  His website is at <a title="ao2: attacchi teoristici" href="http://ao2.it">ao2.it</a>
+  </address>
   </dd>
 
   <dt>blockquote</dt>
   <dd>
   I usually say:
   </dd>
 
   <dt>blockquote</dt>
   <dd>
   I usually say:
-  <blockquote cite="myself">Better looser than poser!</blockquote>
+  <blockquote cite="myself"><p>Better looser than poser!</p></blockquote>
   Not very widespread these days.
   </dd>
 
   Not very widespread these days.
   </dd>
 
@@ -411,10 +421,10 @@ They are all style-able.
 
   <dt>dfn</dt>
   <dd>I wonder how much my silly definition of happiness:
 
   <dt>dfn</dt>
   <dd>I wonder how much my silly definition of happiness:
-  <dfn>
-    Happiness is the limit of our mood function when “how I currently feel” approaches
+  <blockquote><p>
+    <dfn>Happiness</dfn> is the limit of our mood function when “how I currently feel” approaches
     to “how I want to feel”
     to “how I want to feel”
-  </dfn>
+  </p></blockquote>
   is flawed...
   </dd>
 
   is flawed...
   </dd>
 
@@ -498,8 +508,9 @@ They are all style-able.
   <dt>samp</dt>
   <dd>
   Let's clean up this file:
   <dt>samp</dt>
   <dd>
   Let's clean up this file:
+  <pre>$ tidy -xml -access 3 -utf8 -i -m $THIS_FILE</pre>
   <samp>
   <samp>
-    tidy -xml -access 3 -utf-8 -i -m $THIS_FILE
+    No warnings or errors were found.
   </samp>
   </dd>
 
   </samp>
   </dd>
 
@@ -515,8 +526,8 @@ They are all style-able.
 
   <dt>var</dt>
   <dd>
 
   <dt>var</dt>
   <dd>
-  This file name is in <var>$THIS_FILE</var>... this is just an example, you
-  know.
+  Save this file to <var>xhtml11_quickref.html</var>... this is just an example value,
+  you can choose the name you like more.
   </dd>
 
 </dl>
   </dd>
 
 </dl>
@@ -539,8 +550,10 @@ They are all style-able.
 
 <h3>List module</h3>
 
 
 <h3>List module</h3>
 
+<p>
 For the list modules we show grouped examples, a <code>dd</code> or a
 <code>li</code> element alone does not have much sense.
 For the list modules we show grouped examples, a <code>dd</code> or a
 <code>li</code> element alone does not have much sense.
+</p>
 
 <dl>
   <dt>dl, dt, dd</dt>
 
 <dl>
   <dt>dl, dt, dd</dt>
@@ -659,7 +672,9 @@ For the list modules we show grouped examples, a <code>dd</code> or a
 
 <h3>Forms module</h3>
 
 
 <h3>Forms module</h3>
 
+<p>
 For the Forms module a grouped example is provided:
 For the Forms module a grouped example is provided:
+</p>
 
 <dl>
   <dt>button, fieldset, form, input, label, legend, select, optgroup, option, textarea</dt>
 
 <dl>
   <dt>button, fieldset, form, input, label, legend, select, optgroup, option, textarea</dt>
@@ -732,7 +747,7 @@ function checksubmit()
 
       <p>
         <label for="user_info">User Info:</label><br />
 
       <p>
         <label for="user_info">User Info:</label><br />
-        <textarea id="user_info" name="user_info">
+        <textarea id="user_info" name="user_info" rows="4" cols="80">
 Some info like favourite dishes and so on...
         </textarea>
       </p>
 Some info like favourite dishes and so on...
         </textarea>
       </p>
@@ -742,8 +757,8 @@ Some info like favourite dishes and so on...
     <p>
       <input id="agree" name="agree" type="checkbox"/>
       <label for="agree">I have read and understood the code</label>
     <p>
       <input id="agree" name="agree" type="checkbox"/>
       <label for="agree">I have read and understood the code</label>
+      <button id="send_button" type="submit" onclick="checksubmit();">Submit?</button>
     </p>
     </p>
-    <button id="send_button" type="submit" onclick="checksubmit();">Submit?</button>
   </form>
 
   </dd>
   </form>
 
   </dd>
@@ -751,7 +766,9 @@ Some info like favourite dishes and so on...
 
 <h3>Table module</h3>
 
 
 <h3>Table module</h3>
 
+<p>
 For the Table module a grouped example is provided:
 For the Table module a grouped example is provided:
+</p>
 
 <dl>
 <dt>caption, col, colgroup, table, tbody, td, tfoot, th, thead, tr</dt>
 
 <dl>
 <dt>caption, col, colgroup, table, tbody, td, tfoot, th, thead, tr</dt>
@@ -773,6 +790,13 @@ For the Table module a grouped example is provided:
       <th>Void</th>
     </tr>
   </thead>
       <th>Void</th>
     </tr>
   </thead>
+  <tfoot>
+    <tr>
+      <td>Sum</td>
+      <td>$280</td>
+      <td colspan="2">0</td>
+    </tr>
+  </tfoot>
   <tbody>
     <tr>
       <td rowspan="2">January</td>
   <tbody>
     <tr>
       <td rowspan="2">January</td>
@@ -792,14 +816,6 @@ For the Table module a grouped example is provided:
       <td>0</td>
     </tr>
   </tbody>
       <td>0</td>
     </tr>
   </tbody>
-  <tfoot>
-    <tr>
-      <td>Sum</td>
-      <td>$280</td>
-      <td colspan="2">0</td>
-    </tr>
-  </tfoot>
-
 </table>
 
 </dd>
 </table>
 
 </dd>
@@ -823,7 +839,7 @@ src="http://www.w3.org/Icons/w3c_main" style="vertical-align: middle;"/> centere
 <dt>map, area</dt>
 <dd>
 
 <dt>map, area</dt>
 <dd>
 
-  <map id="map1" name="map1">
+  <map id="map1">
     <area nohref="nohref" alt="Vesuvio" title="Vesuvio" shape="poly"
     coords="156,183, 180,177, 203,167, 213,162, 225,160, 244,163, 266,155, 278,157, 286,163, 309,170, 331,175, 353,179, 372,184, 325,183, 287,179, 256,182, 232,184, 196,183, 156,183, 156,183, 156,183" />
     <area href="http://en.wikipedia.org/wiki/Napoli" alt="Napoli" title="Napoli" shape="poly"
     <area nohref="nohref" alt="Vesuvio" title="Vesuvio" shape="poly"
     coords="156,183, 180,177, 203,167, 213,162, 225,160, 244,163, 266,155, 278,157, 286,163, 309,170, 331,175, 353,179, 372,184, 325,183, 287,179, 256,182, 232,184, 196,183, 156,183, 156,183, 156,183" />
     <area href="http://en.wikipedia.org/wiki/Napoli" alt="Napoli" title="Napoli" shape="poly"
@@ -831,7 +847,7 @@ src="http://www.w3.org/Icons/w3c_main" style="vertical-align: middle;"/> centere
     <area nohref="nohref" alt="Moon" title="Moon" shape="circle"
     coords="442,128,10" />
   </map>
     <area nohref="nohref" alt="Moon" title="Moon" shape="circle"
     coords="442,128,10" />
   </map>
-  <img src="http://silvioirio.files.wordpress.com/2008/01/napoli2.jpg" alt="Napoli" usemap="#map1" />
+  <img src="http://silvioirio.files.wordpress.com/2008/01/napoli2.jpg" alt="Napoli" usemap="map1" />
 
 </dd>
 </dl>
 
 </dd>
 </dl>
XHTML 1.1 quick reference by examples