[css-content] update examples from css-pseudo to use new version of alt

Author: dauwhe

css-content/Overview.bs

@@ -132,6 +132,48 @@ Issue: should the contents keyword be replaced with ''content()''
 
 
 
+   Generated content often needs alternative text. 
+   If the value of the content property is a string, 
+   this string should be used by assistive technology
+   unless an alternative is provided. This allows
+   purely decorative text to be ignored by providing
+   the empty string as alternative text. 
+   Appropriate alternative text must be provided for
+   images inserted via the content property as well.
+
+
+  <!--examples from CSS-PSEUDO, redone with our new syntax-->
+
+  <div class="example">
+	  Here the content property is an image, so the alt value is required to provide alternative text.
+
+	  <pre>
+	  .new::before {
+	    content: url(./img/star.png) / "New!";
+        /* or a localized attribute from the DOM: attr("data-alt") */
+	  }
+	  </pre>
+  </div>
+
+  <div class="example">
+	  If the pseudo-element is purely decorative and its function is covered elsewhere, setting alt to the empty string can avoid reading out the decorative element. Here the ARIA attribute will be spoken as "collapsed". Without the empty string alt value, the content would also be spoken as "Black right-pointing pointer".
+
+	  <pre>
+	  .expandable::before {
+	    content: "\25BA" / ""; 
+		/* a.k.a. ► */
+	    /* aria-expanded="false" already in DOM,
+	       so this pseudo-element is decorative */
+	  }
+	  </pre>
+  </div>
+
+  <!--end copy from CSS-PSEUDO-->
+
+
+
+
+
 <h2 id="content-functions">
 Content Values and Functions</h2>
 
@@ -929,46 +971,6 @@ Automatic counters and numbering: the 'counter-increment' and 'counter-reset' pr
 
 
 
-<!--find home for examples-->
-
-
-  <div class="example">
-	  Here the content property is an image, so the alt property is required to provide alternative text.
-
-	  <pre>
-	  .new::before {
-	    content: url(./img/star.png);
-	    alt: "New!"; /* or a localized attribute from the DOM: attr("data-alt") */
-	  }
-	  </pre>
-  </div>
-
-  <div class="example">
-	  If the pseudo-element is purely decorative and its function is covered elsewhere, setting alt to the empty string can avoid reading out the decorative element. Here the ARIA attribute will be spoken as "collapsed". Without the empty string alt value, the content would also be spoken as "Black right-pointing pointer".
-
-	  <pre>
-	  .expandable::before {
-	    content: "\25BA"; /* a.k.a. ► */
-	    alt: "";
-	    /* aria-expanded="false" already in DOM,
-	       so this pseudo-element is decorative */
-	  }
-	  </pre>
-  </div>
-
-  <!--end copy from CSS-PSEUDO-->
-
-
-
-
-
-
-
-
-
-
-
-
 <h2 id="css-bookmarks">
 Bookmarks
 </h2>