[html5] r3804 - [e] (0) <hr> and <span> examples.
whatwg at whatwg.org
whatwg at whatwg.org
Thu Sep 10 21:35:40 PDT 2009
Author: ianh
Date: 2009-09-10 21:35:39 -0700 (Thu, 10 Sep 2009)
New Revision: 3804
Modified:
index
source
Log:
[e] (0) <hr> and <span> examples.
Modified: index
===================================================================
--- index 2009-09-11 03:42:37 UTC (rev 3803)
+++ index 2009-09-11 04:35:39 UTC (rev 3804)
@@ -14042,7 +14042,40 @@
a story, or a transition to another topic within a section of a
reference book.</p>
+ <div class=example>
+ <p>The following extract from <cite>Pandora's Star</cite> by Peter
+ F. Hamilton shows two paragraphs that precede a scene change and
+ the paragraph that follows it. The scene change, represented in the
+ printed book by a gap containing a solitary centered star between
+ the second and third paragraphs, is here represented using the
+ <code><a href=#the-hr-element>hr</a></code> element.</p>
+
+ <!-- ISBN 1-4050-0020-1; bottom of page 14 -->
+
+ <pre lang=en-GB><p>Dudley was ninety-two, in his second life, and fast approaching
+time for another rejuvenation. Despite his body having the physical
+age of a standard fifty-year-old, the prospect of a long degrading
+campaign within academia was one he regarded with dread. For a
+supposedly advanced civilization, the Intersolar Commonwearth could be
+appallingly backward at times, not to mention cruel.</p>
+<p><i>Maybe it won't be that bad</i>, he told himself. The lie was
+comforting enough to get him through the rest of the night's
+shift.</p>
+<strong><hr></strong>
+<p>The Carlton AllLander drove Dudley home just after dawn. Like the
+astronomer, the vehicle was old and worn, but perfectly capable of
+doing its job. It had a cheap diesel engine, common enough on a
+semi-frontier world like Gralmond, although its drive array was a
+thoroughly modern photoneural processor. With its high suspension and
+deep-tread tyres it could plough along the dirt track to the
+observatory in all weather and seasons, including the metre-deep snow
+of Gralmond's winters.</p></pre>
+
+ </div>
+
+
+
<h4 id=the-br-element><span class=secno>4.5.3 </span>The <dfn><code>br</code></dfn> element</h4>
<dl class=element><dt>Categories</dt>
@@ -16070,7 +16103,6 @@
</legend>
</figure></pre>
-
</div>
@@ -16225,8 +16257,6 @@
-
-
<h4 id=the-i-element><span class=secno>4.6.15 </span>The <dfn><code>i</code></dfn> element</h4>
<dl class=element><dt>Categories</dt>
@@ -16672,6 +16702,7 @@
</div>
+
<h4 id=the-meter-element><span class=secno>4.6.19 </span>The <dfn><code>meter</code></dfn> element</h4>
<!-- Keep this after <progress> and NOT close to <time> -->
@@ -17343,6 +17374,9 @@
</div>
+
+
+
<h4 id=the-span-element><span class=secno>4.6.24 </span>The <dfn><code>span</code></dfn> element</h4>
<dl class=element><dt>Categories</dt>
@@ -17363,8 +17397,25 @@
e.g. <code title=attr-class><a href=#classes>class</a></code>, <code title=attr-lang><a href=#attr-lang>lang</a></code>, or <code title=attr-dir><a href=#the-dir-attribute>dir</a></code>. It <a href=#represents>represents</a> its
children.</p>
+ <div class=example>
+ <p>In this example, a code fragment is marked up using
+ <code><a href=#the-span-element>span</a></code> elements and <code title=attr-class><a href=#classes>class</a></code> attributes so that its keywords and
+ identifiers can be color-coded from CSS:</p>
+ <!-- extract from http://www.cs.cmu.edu/~dst/DeCSS/Gallery/vlc-dvd_css-c.txt -->
+
+ <pre><pre><code class="lang-c"><span class="keyword">for</span> (<span class="ident">j</span> = 0; <span class="ident">j</span> < 256; <span class="ident">j</span>++) {
+ <span class="ident">i_t3</span> = (<span class="ident">i_t3</span> & 0x1ffff) | (<span class="ident">j</span> << 17);
+ <span class="ident">i_t6</span> = (((((((<span class="ident">i_t3</span> >> 3) ^ <span class="ident">i_t3</span>) >> 1) ^ <span class="ident">i_t3</span>) >> 8) ^ <span class="ident">i_t3</span>) >> 5) & 0xff;
+ <span class="keyword">if</span> (<span class="ident">i_t6</span> == <span class="ident">i_t1</span>)
+ <span class="keyword">break</span>;
+}</code></pre></pre>
+
+ </div>
+
+
+
<h4 id=usage-summary><span class=secno>4.6.25 </span>Usage summary</h4>
<p><i>This section is non-normative.</i></p>
Modified: source
===================================================================
--- source 2009-09-11 03:42:37 UTC (rev 3803)
+++ source 2009-09-11 04:35:39 UTC (rev 3804)
@@ -14987,7 +14987,40 @@
a story, or a transition to another topic within a section of a
reference book.</p>
+ <div class="example">
+ <p>The following extract from <cite>Pandora's Star</cite> by Peter
+ F. Hamilton shows two paragraphs that precede a scene change and
+ the paragraph that follows it. The scene change, represented in the
+ printed book by a gap containing a solitary centered star between
+ the second and third paragraphs, is here represented using the
+ <code>hr</code> element.</p>
+
+ <!-- ISBN 1-4050-0020-1; bottom of page 14 -->
+
+ <pre lang="en-GB"><p>Dudley was ninety-two, in his second life, and fast approaching
+time for another rejuvenation. Despite his body having the physical
+age of a standard fifty-year-old, the prospect of a long degrading
+campaign within academia was one he regarded with dread. For a
+supposedly advanced civilization, the Intersolar Commonwearth could be
+appallingly backward at times, not to mention cruel.</p>
+<p><i>Maybe it won't be that bad</i>, he told himself. The lie was
+comforting enough to get him through the rest of the night's
+shift.</p>
+<strong><hr></strong>
+<p>The Carlton AllLander drove Dudley home just after dawn. Like the
+astronomer, the vehicle was old and worn, but perfectly capable of
+doing its job. It had a cheap diesel engine, common enough on a
+semi-frontier world like Gralmond, although its drive array was a
+thoroughly modern photoneural processor. With its high suspension and
+deep-tread tyres it could plough along the dirt track to the
+observatory in all weather and seasons, including the metre-deep snow
+of Gralmond's winters.</p></pre>
+
+ </div>
+
+
+
<h4>The <dfn><code>br</code></dfn> element</h4>
<dl class="element">
@@ -17191,7 +17224,6 @@
</legend>
</figure></pre>
-
</div>
@@ -17356,8 +17388,6 @@
-
-
<h4>The <dfn><code>i</code></dfn> element</h4>
<dl class="element">
@@ -17834,6 +17864,7 @@
</div>
+
<h4>The <dfn><code>meter</code></dfn> element</h4>
<!-- Keep this after <progress> and NOT close to <time> -->
@@ -18581,6 +18612,9 @@
</div>
+
+
+
<h4>The <dfn><code>span</code></dfn> element</h4>
<dl class="element">
@@ -18606,8 +18640,26 @@
title="attr-dir">dir</code>. It <span>represents</span> its
children.</p>
+ <div class="example">
+ <p>In this example, a code fragment is marked up using
+ <code>span</code> elements and <code
+ title="attr-class">class</code> attributes so that its keywords and
+ identifiers can be color-coded from CSS:</p>
+ <!-- extract from http://www.cs.cmu.edu/~dst/DeCSS/Gallery/vlc-dvd_css-c.txt -->
+
+ <pre><pre><code class="lang-c"><span class="keyword">for</span> (<span class="ident">j</span> = 0; <span class="ident">j</span> < 256; <span class="ident">j</span>++) {
+ <span class="ident">i_t3</span> = (<span class="ident">i_t3</span> & 0x1ffff) | (<span class="ident">j</span> << 17);
+ <span class="ident">i_t6</span> = (((((((<span class="ident">i_t3</span> >> 3) ^ <span class="ident">i_t3</span>) >> 1) ^ <span class="ident">i_t3</span>) >> 8) ^ <span class="ident">i_t3</span>) >> 5) & 0xff;
+ <span class="keyword">if</span> (<span class="ident">i_t6</span> == <span class="ident">i_t1</span>)
+ <span class="keyword">break</span>;
+}</code></pre></pre>
+
+ </div>
+
+
+
<h4>Usage summary</h4>
<p><i>This section is non-normative.</i></p>
More information about the Commit-Watchers
mailing list