[e] (0) Try to explain 'transparent' with an example.

git-svn-id: http://svn.whatwg.org/webapps@4125 340c8d12-0b0e-0410-8428-c7bf67bfef74
whatwg · Oct 13, 2009 · b2e3aca · b2e3aca
1 parent 20ba5cc
commit b2e3aca
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 0 deletions.
diff --git a/complete.html b/complete.html
@@ -8998,6 +8998,23 @@ <h5 id=transparent-content-models><span class=secno>3.2.5.2 </span>Transparent c
   element, by the children in the "transparent" part of their content
   model, retaining order.</p>
 
+  <div class=example>
+
+   <p>Consider the following markup fragment:</p>
+
+   <pre>&lt;p&gt;Hello &lt;a href="world.html"&gt;&lt;em&gt;wonderful&lt;/em&gt; world&lt;/a&gt;!&lt;/p&gt;</pre>
+
+   <p>Its DOM looks like the following:</p>
+
+   <ul class=domTree><li class=t1><code><a href=#the-p-element>p</a></code><ul><li class=t3><code>#text</code>: <span title="">Hello </span><li class=t1><code><a href=#the-a-element>a</a></code> <span class=t2><code class="attribute name">href</code>="<code class="attribute value">world.html</code>"</span><ul><li class=t1><code><a href=#the-em-element>em</a></code><ul><li class=t3><code>#text</code>: <span title="">wonderful</span></ul><li class=t3><code>#text</code>: <span title=""> world</span></ul><li class=t3><code>#text</code>: <span title="">!</span></ul></ul><p>The content model of the <code><a href=#the-a-element>a</a></code> element is
+   <a href=#transparent>transparent</a>. To see if its contents are conforming,
+   therefore, the element is replaced by its contents:</p>
+
+   <ul class=domTree><li class=t1><code><a href=#the-p-element>p</a></code><ul><li class=t3><code>#text</code>: <span title="">Hello </span><li class=t1><code><a href=#the-em-element>em</a></code><ul><li class=t3><code>#text</code>: <span title="">wonderful</span><li class=t3><code>#text</code>: <span title=""> world</span></ul><li class=t3><code>#text</code>: <span title="">!</span></ul></ul><p>Since that is conforming, the contents of the <code><a href=#the-a-element>a</a></code> are
+   conforming in the original fragment.</p>
+
+  </div>
+
   <p>When a transparent element has no parent, then the part of its
   content model that is "transparent" must instead be treated as
   accepting any <a href=#flow-content>flow content</a>.</p>

diff --git a/index b/index
@@ -8828,6 +8828,23 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%0
   element, by the children in the "transparent" part of their content
   model, retaining order.</p>
 
+  <div class=example>
+
+   <p>Consider the following markup fragment:</p>
+
+   <pre>&lt;p&gt;Hello &lt;a href="world.html"&gt;&lt;em&gt;wonderful&lt;/em&gt; world&lt;/a&gt;!&lt;/p&gt;</pre>
+
+   <p>Its DOM looks like the following:</p>
+
+   <ul class=domTree><li class=t1><code><a href=#the-p-element>p</a></code><ul><li class=t3><code>#text</code>: <span title="">Hello </span><li class=t1><code><a href=#the-a-element>a</a></code> <span class=t2><code class="attribute name">href</code>="<code class="attribute value">world.html</code>"</span><ul><li class=t1><code><a href=#the-em-element>em</a></code><ul><li class=t3><code>#text</code>: <span title="">wonderful</span></ul><li class=t3><code>#text</code>: <span title=""> world</span></ul><li class=t3><code>#text</code>: <span title="">!</span></ul></ul><p>The content model of the <code><a href=#the-a-element>a</a></code> element is
+   <a href=#transparent>transparent</a>. To see if its contents are conforming,
+   therefore, the element is replaced by its contents:</p>
+
+   <ul class=domTree><li class=t1><code><a href=#the-p-element>p</a></code><ul><li class=t3><code>#text</code>: <span title="">Hello </span><li class=t1><code><a href=#the-em-element>em</a></code><ul><li class=t3><code>#text</code>: <span title="">wonderful</span><li class=t3><code>#text</code>: <span title=""> world</span></ul><li class=t3><code>#text</code>: <span title="">!</span></ul></ul><p>Since that is conforming, the contents of the <code><a href=#the-a-element>a</a></code> are
+   conforming in the original fragment.</p>
+
+  </div>
+
   <p>When a transparent element has no parent, then the part of its
   content model that is "transparent" must instead be treated as
   accepting any <a href=#flow-content>flow content</a>.</p>

diff --git a/source b/source
@@ -9060,6 +9060,27 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%0
   element, by the children in the "transparent" part of their content
   model, retaining order.</p>
 
+  <div class="example">
+
+   <p>Consider the following markup fragment:</p>
+
+   <pre>&lt;p>Hello &lt;a href="world.html">&lt;em>wonderful&lt;/em> world&lt;/a>!&lt;/p></pre>
+
+   <p>Its DOM looks like the following:</p>
+
+   <ul class="domTree"><li class="t1"><code>p</code><ul><li class="t3"><code>#text</code>: <span title="">Hello </span></li><li class="t1"><code>a</code> <span class="t2"><code class="attribute name">href</code>="<code class="attribute value">world.html</code>"</span><ul><li class="t1"><code>em</code><ul><li class="t3"><code>#text</code>: <span title="">wonderful</span></li></ul></li><li class="t3"><code>#text</code>: <span title=""> world</span></li></ul></li><li class="t3"><code>#text</code>: <span title="">!</span></li></ul></li></ul>
+
+   <p>The content model of the <code>a</code> element is
+   <span>transparent</span>. To see if its contents are conforming,
+   therefore, the element is replaced by its contents:</p>
+
+   <ul class="domTree"><li class="t1"><code>p</code><ul><li class="t3"><code>#text</code>: <span title="">Hello </span></li><li class="t1"><code>em</code><ul><li class="t3"><code>#text</code>: <span title="">wonderful</span></li><li class="t3"><code>#text</code>: <span title=""> world</span></li></ul></li><li class="t3"><code>#text</code>: <span title="">!</span></li></ul></li></ul>
+
+   <p>Since that is conforming, the contents of the <code>a</code> are
+   conforming in the original fragment.</p>
+
+  </div>
+
   <p>When a transparent element has no parent, then the part of its
   content model that is "transparent" must instead be treated as
   accepting any <span>flow content</span>.</p>