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>
-->
<style type="text/css">
+ /*<![CDATA[*/
.red {
color: red;
script {}
*/
+ /*]]>*/
</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>
<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.
+</p>
<h3>Text module</h3>
+<p>
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>
<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&source=s_q&hl=it&geocode=&q=naples,+IT&sll=26.160677,-81.795616&sspn=0.137744,0.265045&ie=UTF8&ll=40.869911,14.252701&spn=0.232099,0.53009&z=11&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:
- <blockquote cite="myself">Better looser than poser!</blockquote>
+ <blockquote cite="myself"><p>Better looser than poser!</p></blockquote>
Not very widespread these days.
</dd>
<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>
+ <dfn>Happiness</dfn> is the limit of our mood function when “how I currently feel” approaches
to “how I want to feel”
- </dfn>
+ </blockquote>
is flawed...
</dd>
<dt>samp</dt>
<dd>
Let's clean up this file:
+ <pre>$ tidy -xml -access 3 -utf8 -i -m $THIS_FILE</pre>
<samp>
- tidy -xml -access 3 -utf-8 -i -m $THIS_FILE
+ No warnings or errors were found.
</samp>
</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>
<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.
+</p>
<dl>
<dt>dl, dt, dd</dt>
<h3>Forms module</h3>
+<p>
For the Forms module a grouped example is provided:
+</p>
<dl>
<dt>button, fieldset, form, input, label, legend, select, optgroup, option, textarea</dt>
<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>
<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>
- <button id="send_button" type="submit" onclick="checksubmit();">Submit?</button>
</form>
</dd>
<h3>Table module</h3>
+<p>
For the Table module a grouped example is provided:
+</p>
<dl>
<dt>caption, col, colgroup, table, tbody, td, tfoot, th, thead, tr</dt>
<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>
<td>0</td>
</tr>
</tbody>
- <tfoot>
- <tr>
- <td>Sum</td>
- <td>$280</td>
- <td colspan="2">0</td>
- </tr>
- </tfoot>
-
</table>
</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="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>
projects / xhtml11_quickref.git / blobdiff