Modified examples in Language of parts (#4240)

Adds content for case where the element's content and attribute values
are in different languages

Closes #4064

Add the requested example for “The element's content and attribute
values are in different languages”.

Also:
1. updated some old attributes that didn’t do anything
2. changed bolded `p` tags to `h3` elements

---------

Co-authored-by: Kenneth G. Franqueiro <[email protected]>

Author: fstrr

understanding/20/language-of-parts.html

@@ -127,51 +127,36 @@ <h2>Benefits of Language of Parts</h2>
 
    <section id="examples">
       <h2>Examples of Language of Parts</h2>
-      
-      <ul>   
-         <li>  
-            <p>  								       
-               <strong>A German phrase in an English sentence.</strong>							     
-            </p>
-            <p>In the sentence, "He maintained that the DDR (German Democratic Republic) was just
-               a '<span lang="de">Treppenwitz der Weltgeschichte</span>'," the German phrase '<span lang="de">Treppenwitz der Weltgeschichte</span>' is marked as German. Depending on the markup language, English may either be marked
-               as the language for the entire document except where specified, or marked at the paragraph
-               level. When a screen reader encounters the German phrase, it changes pronunciation
-               rules from English to German to pronounce the word correctly.
-            </p>
-         </li>
-         <li>
-            <p>  								       
-               <strong>Alternative language links</strong>							     
-            </p>
-            <p>An HTML web page includes links to versions of the page in other languages (e.g.,
-               <span lang="de">Deutsch</span>, <span lang="fr">Français</span>, <span lang="nl">Nederlands</span>, <span lang="ca">Catalan</span>, etc.). The text of each link is the name of the language, in that language. The language of each link is indicated via a <code class="att">lang</code> attribute.
-            </p>
-<pre xml:space="preserve"><code>&lt;ul&gt;
+      							       
+      <h3>A German phrase in an English sentence</h3>
+      <p>In the sentence, "He maintained that the DDR (German Democratic Republic) was just a '<span lang="de">Treppenwitz der Weltgeschichte</span>'," the German phrase '<span lang="de">Treppenwitz der Weltgeschichte</span>' is marked as German. Depending on the markup language, English may either be marked as the language for the entire document except where specified, or marked at the paragraph level. When a screen reader encounters the German phrase, it changes pronunciation rules from English to German to pronounce the word correctly.</p>
+         
+      <h3>Alternative language links</h3>
+      <p>An HTML web page includes links to versions of the page in other languages (e.g.,
+         <span lang="de">Deutsch</span>, <span lang="fr">Français</span>, <span lang="nl">Nederlands</span>, <span lang="ca">Catalan</span>, etc.). The text of each link is the name of the language, in that language. The language of each link is indicated via a <code class="language-html">lang</code> attribute.</p>
+<pre xml:space="preserve"><code class="language-html">&lt;ul&gt;
   &lt;li&gt;&lt;a href="..." lang="de"&gt;Deutsch&lt;/a&gt;&lt;/li&gt;
   &lt;li&gt;&lt;a href="..." lang="it"&gt;Italiano&lt;/a&gt;&lt;/li&gt;
   &lt;li&gt;&lt;a href="..." lang="fr"&gt;Français&lt;/a&gt;&lt;/li&gt;
   ...
   &lt;li&gt;&lt;a href="..." lang="zh-hant"&gt;繁體中文&lt;/a&gt;&lt;/li&gt;
 &lt;/ul&gt;</code></pre>
-         </li>
-         <li>
-            <p>  								       
-               <strong>"Podcast" used in a French sentence.</strong>							     
-            </p>
-            <p>Because "podcast" is part of the vernacular of the immediately surrounding text in
-               the following excerpt, "<span lang="fr">À l'occasion de l'exposition "Energie éternelle. 1500 ans d'art indien", le Palais des Beaux-Arts de Bruxelles a lancé son premier podcast. Vous pouvez télécharger ce podcast au format M4A et MP3</span>", no indication of language change is required.
-            </p>
-         </li>
-      </ul>
+
+         <h3>"Podcast" used in a French sentence</h3>
+         <p>Because "podcast" is part of the vernacular of the immediately surrounding text in the following excerpt, "<span lang="fr">À l'occasion de l'exposition "Energie éternelle. 1500 ans d'art indien", le Palais des Beaux-Arts de Bruxelles a lancé son premier podcast. Vous pouvez télécharger ce podcast au format M4A et MP3</span>", no indication of language change is required.</p>
+
+         <h3>The element's content and attribute values are in different languages</h3>
+         <p>This example assumes that the page's default content is in English. The link's <code class="language-html">title</code> attribute is in English, but the nested <code class="language-html">span</code> element that contains the word <span lang="es">Español</span> has a <code>lang="es"</code> attribute.</p>
+
+         <p><code class="language-html">&lt;a title="Spanish" href="qa-html-language-declarations-es.html"&gt;&lt;span lang="es"&gt;Español&lt;/span&gt;&lt;/a&gt;</code></p>
    </section>
 
    <section id="resources">
       <h2>Resources for Language of Parts</h2>
 
       <ul>
          <li>
-            <a href="https://html.spec.whatwg.org/multipage/dom.html#attr-lang">HTML - The <code class="att">lang</code> and <code class="att">xml:lang</code> attributes</a>.
+            <a href="https://html.spec.whatwg.org/multipage/dom.html#attr-lang">HTML - The <code class="language-html">lang</code> and <code class="language-html">xml:lang</code> attributes</a>.
             </li>
          <li>
             <a href="https://www.w3.org/International/articles/language-tags/index.en">Language tags in HTML and XML</a>.
@@ -191,10 +176,10 @@ <h3>Sufficient Techniques for Language of Parts</h3>
 
          <ul> 
             <li>  									         
-               <a href="../Techniques/html/H58" class="html">Using the lang attribute to identify changes in the human language</a>.	       
+               <a href="../Techniques/html/H58">Using the lang attribute to identify changes in the human language</a>.	       
             </li>
             <li>
-               <a href="../Techniques/pdf/PDF19" class="pdf">Specifying the language for a passage or phrase with the Lang entry in PDF documents</a>.
+               <a href="../Techniques/pdf/PDF19">Specifying the language for a passage or phrase with the Lang entry in PDF documents</a>.
             </li>
          </ul>