mdn · teoli2003 · Jul 20, 2022 · Jul 20, 2022 · Jul 20, 2022 · Jul 20, 2022
@@ -51,7 +51,7 @@ mask-image: image(url(mask.png), skyblue, linear-gradient(rgba(0, 0, 0, 1.0), tr
 content: url(star.svg) url(star.svg) url(star.svg) url(star.svg) url(star.svg);
 
 /* at-rules */
-@document url("https://www.example.com/") { ... } {{Experimental_Inline}}
+@document url("https://www.example.com/") { /* … */ } {{Experimental_Inline}}
 @import url("https://www.example.com/style.css");
 @namespace url(http://www.w3.org/1999/xhtml);
 ```

@@ -51,8 +51,8 @@ word-spacing: unset;
 ### HTML
 
 ```html
-<div id="mozdiv1">Here are many words...</div>
-<div id="mozdiv2">...and many more!</div>
+<div id="mozdiv1">Lorem ipsum dolor sit amet.</div>
+<div id="mozdiv2">Lorem ipsum dolor sit amet.</div>
 ```
 
 ### CSS

@@ -19,7 +19,7 @@ Events can be created with the [`Event`](/en-US/docs/Web/API/Event) constructor
 const event = new Event('build');
 
 // Listen for the event.
-elem.addEventListener('build', function (e) { /* ... */ }, false);
+elem.addEventListener('build', function (e) { /* … */ }, false);
 
 // Dispatch the event.
 elem.dispatchEvent(event);

@@ -18,9 +18,9 @@ To use an EXSLT function, you need to declare the namespace the function is in,
                 xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                 xmlns:regexp="http://exslt.org/regular-expressions">
   <xsl:template match="/">
-    ...
+    …
     <xsl:value-of select="regexp:replace(/root/@value, 'before', 'gi', 'AFTER')"/>
-    ...
+    …
   </xsl:template>
 
 </xsl:stylesheet>

@@ -28,7 +28,7 @@ In order to make an [HTTP](/en-US/docs/Web/HTTP) request to the server with Java
 
 ```js
 // Old compatibility code, no longer needed.
-if (window.XMLHttpRequest) { // Mozilla, Safari, IE7+ ...
+if (window.XMLHttpRequest) { // Mozilla, Safari, IE7+, etc.
     httpRequest = new XMLHttpRequest();
 } else if (window.ActiveXObject) { // IE 6 and older
     httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
@@ -248,7 +248,7 @@ We need to modify `makeRequest()` to accept the user data and pass it along to t
 ```js
 function makeRequest(url, userName) {
 
-  ...
+  // …
 
   httpRequest.onreadystatechange = alertContents;
   httpRequest.open('POST', url);

@@ -53,7 +53,7 @@ Specifying `autoplay` will cause the audio to start playing as soon as possible
 
 ```html
 <audio autoplay>
-  ...
+  …
 </audio>
 ```
 
@@ -65,7 +65,7 @@ The `loop` attribute will ensure that upon getting to the end of the audio clip,
 
 ```html
 <audio loop>
-  ...
+  …
 </audio>
 ```
 
@@ -75,7 +75,7 @@ If you want the audio to start muted (no volume), add the `muted` attribute.
 
 ```html
 <audio muted>
-  ...
+  …
 </audio>
 ```
 
@@ -95,7 +95,7 @@ The `preload` attribute allows you to specify a preference for how the browser p
 
 ```html
 <audio preload="auto">
-  ...
+  …
 </audio>
 ```
 
@@ -105,7 +105,7 @@ We specify the `controls` attribute when we require the browser to provide us wi
 
 ```html
 <audio controls>
-  ...
+  …
 </audio>
 ```
 
@@ -115,7 +115,7 @@ As mentioned above, you can use the {{ htmlelement("source") }} element to speci
 
 ```html
 <audio src="audiofile.mp3">
-  ...
+  …
 </audio>
 ```
 
@@ -125,7 +125,7 @@ As mentioned above, to be sure that the browser knows what type of file is being
 
 ```html
 <audio src="audiofile.mp3" type="audio/mpeg">
-  ...
+  …
 </audio>
 ```
 
@@ -137,7 +137,7 @@ Given the following HTML:
 
 ```html
 <audio id="my-audio" src="audiofile.mp3">
-  ...
+  …
 </audio>
 ```
 

@@ -109,7 +109,7 @@ To begin with, it's a good idea to first check if the browser actually supports
 var supportsVideo = !!document.createElement('video').canPlayType;
 if (supportsVideo) {
    // set up custom controls
-   // ...
+   // …
 }
 ```
 

@@ -88,7 +88,7 @@ We set the source of the audio depending on the type of audio file the browser s
 It's also possible to feed an {{ htmlelement("audio") }} element a base64 encoded WAV file, allowing to generate audio on the fly:
 
 ```html
-<audio id="player" src="data:audio/x-wav;base64,UklGRvC..."></audio>
+<audio id="player" src="data:audio/x-wav;base64,UklGRvC…"></audio>
 ```
 
 [Speak.js](https://github.com/kripken/speak.js/) employs this technique. [Try the demo](https://speak-demo.herokuapp.com).

@@ -125,13 +125,13 @@ play list ->                /segments/news.mp4.mpd
 
 main segment folder ->      /segments/main/
 
-100 Kbps segment folder ->  /segments/main/news100 contains (1.m4s, 2.m4s, 3.m4s ... )
+100 Kbps segment folder ->  /segments/main/news100 contains (1.m4s, 2.m4s, 3.m4s … )
 
-200 Kbps segment folder ->  /segments/main/news200 contains (1.m4s, 2.m4s, 3.m4s ... )
+200 Kbps segment folder ->  /segments/main/news200 contains (1.m4s, 2.m4s, 3.m4s … )
 
-300 Kbps segment folder ->  /segments/main/news300 contains (1.m4s, 2.m4s, 3.m4s ... )
+300 Kbps segment folder ->  /segments/main/news300 contains (1.m4s, 2.m4s, 3.m4s … )
 
-400 Kbps segment folder ->  /segments/main/news400 contains (1.m4s, 2.m4s, 3.m4s ... )
+400 Kbps segment folder ->  /segments/main/news400 contains (1.m4s, 2.m4s, 3.m4s … )
 ```
 
 The playlist or `.mpd` file contains XML that explicitly lists where all the various bitrate files reside.
@@ -178,7 +178,7 @@ The playlist or `.mpd` file contains XML that explicitly lists where all the var
           </SegmentList>
         </Representation>
 
-        ...
+        …
 
       </AdaptationSet>
     </Period>

@@ -159,11 +159,11 @@ For example, the play/pause button has the following background image definition
 
 ```css
 .controls button[data-state="play"] {
-   background-image: url('data:image/png;base64,iVBORw0KGgoAAA ... ');
+   background-image: url('data:image/png;base64,iVBORw0KGgoAAA…');
 }
 
 .controls button[data-state="pause"] {
-   background-image: url('data:image/png;base64,iVBORw0KGgoAAA ... ');
+   background-image: url('data:image/png;base64,iVBORw0KGgoAAA…');
 }
 ```
 

@@ -113,7 +113,7 @@ This example uses `<aside>` to mark up a paragraph in an article. The paragraph
     </p>
   </aside>
   <p>
-    More info about the movie...
+    More info about the movie…
   </p>
 </article>
 ```

@@ -119,7 +119,7 @@ This example opens a modal dialog that contains a form, when the "Update details
   <form method="dialog">
     <p><label>Favorite animal:
       <select>
-        <option value="default">Choose...</option>
+        <option value="default">Choose…</option>
         <option>Brine shrimp</option>
         <option>Red panda</option>
         <option>Spider monkey</option>

@@ -145,7 +145,7 @@ This element only includes the [global attributes](/en-US/docs/Web/HTML/Global_a
     <p>Posted on Wednesday, <time datetime="2017-10-04">4 October 2017</time> by Jane Smith</p>
   </header>
   <p>We live on a planet that's blue and green, with so many things still unseen.</p>
-  <p><a href="https://example.com/the-planet-earth/">Continue reading....</a></p>
+  <p><a href="https://example.com/the-planet-earth/">Continue reading…</a></p>
 </article>
 ```
 

@@ -125,17 +125,17 @@ The following code shows a few headings with some content under them.
 ```html
 <h1>Heading elements</h1>
 <h2>Summary</h2>
-<p>Some text here...</p>
+<p>Some text here…</p>
 
 <h2>Examples</h2>
 <h3>Example 1</h3>
-<p>Some text here...</p>
+<p>Some text here…</p>
 
 <h3>Example 2</h3>
-<p>Some text here...</p>
+<p>Some text here…</p>
 
 <h2>See also</h2>
-<p>Some text here...</p>
+<p>Some text here…</p>
 ```
 
 Here is the result of this code:

@@ -96,7 +96,7 @@ The `<hgroup>` itself has no impact on the document outline of a web page. Rathe
   </hgroup>
   <p>Some intro to the document.</p>
   <h2>Table of contents</h2>
-  <ol id=toc>...</ol>
+  <ol id=toc>…</ol>
   <h2>First section</h2>
   <p>Some intro to the first section.</p>
 </body>

@@ -79,8 +79,8 @@ This element includes the [global attributes](/en-US/docs/Web/HTML/Global_attrib
 ```html
 <!DOCTYPE html>
 <html lang="en">
-  <head>...</head>
-  <body>...</body>
+  <head>…</head>
+  <body>…</body>
 </html>
 ```
 

@@ -215,7 +215,7 @@ You can provide a useful placeholder inside your search input that could give a
 <form>
   <div>
     <input type="search" id="mySearch" name="q"
-     placeholder="Search the site...">
+     placeholder="Search the site…">
     <button>Search</button>
   </div>
 </form>
@@ -240,7 +240,7 @@ Let's have a look at an example:
 <form role="search">
   <div>
     <input type="search" id="mySearch" name="q"
-     placeholder="Search the site..."
+     placeholder="Search the site…"
      aria-label="Search through site content">
     <button>Search</button>
   </div>
@@ -263,7 +263,7 @@ The physical size of the input box can be controlled using the {{htmlattrxref("s
 <form>
   <div>
     <input type="search" id="mySearch" name="q"
-    placeholder="Search the site..." size="30">
+    placeholder="Search the site…" size="30">
     <button>Search</button>
   </div>
 </form>
@@ -307,7 +307,7 @@ You can use the {{htmlattrxref("required", "input")}} attribute as an easy way o
 <form>
   <div>
     <input type="search" id="mySearch" name="q"
-    placeholder="Search the site..." required>
+    placeholder="Search the site…" required>
     <button>Search</button>
     <span class="validity"></span>
   </div>

@@ -101,16 +101,16 @@ The content of a `<main>` element should be unique to the document. Content that
     <h2>Red Delicious</h2>
     <p>These bright red apples are the most common found in many
     supermarkets.</p>
-    <p>... </p>
-    <p>... </p>
+    <p>…</p>
+    <p>…</p>
   </article>
 
   <article>
     <h2>Granny Smith</h2>
     <p>These juicy, green apples make a great filling for
     apple pies.</p>
-    <p>... </p>
-    <p>... </p>
+    <p>…</p>
+    <p>…</p>
   </article>
 </main>
 

@@ -126,7 +126,7 @@ If the `<progress>` element is describing the loading progress of a section of a
 
   <!-- ... -->
 
-  <progress id="progress-bar" aria-label="Content loading..."></progress>
+  <progress id="progress-bar" aria-label="Content loading…"></progress>
 ```
 
 ## Specifications

@@ -134,7 +134,7 @@ In mathematics, families of variables related to the same concept (such as dista
 
 ```html
 <p>The horizontal coordinates' positions along the X-axis are
-represented as <var>x<sub>1</sub></var> ... <var>x<sub>n</sub></var>.</p>
+represented as <var>x<sub>1</sub></var> … <var>x<sub>n</sub></var>.</p>
 ```
 
 The resulting output:

@@ -156,7 +156,7 @@ textTrackElem.addEventListener("cuechange", event => {
    <track kind="metadata" src="keyStage3.vtt" srclang="en"
      label="Key Stage 3">
    <!-- Fallback -->
-   ...
+   …
 </video>
 ```
 

@@ -13,7 +13,7 @@ browser-compat: html.global_attributes
 
 **Global attributes** are attributes common to all HTML elements; they can be used on all elements, though they may have no effect on some elements.
 
-Global attributes may be specified on all [HTML elements](/en-US/docs/Web/HTML/Element), _even those not specified in the standard_. That means that any non-standard elements must still permit these attributes, even though using those elements means that the document is no longer HTML5-compliant. For example, HTML5-compliant browsers hide content marked as `<foo hidden>...</foo>`, even though `<foo>` is not a valid HTML element.
+Global attributes may be specified on all [HTML elements](/en-US/docs/Web/HTML/Element), _even those not specified in the standard_. That means that any non-standard elements must still permit these attributes, even though using those elements means that the document is no longer HTML5-compliant. For example, HTML5-compliant browsers hide content marked as `<foo hidden>…</foo>`, even though `<foo>` is not a valid HTML element.
 
 In addition to the basic HTML global attributes, the following global attributes also exist:
 

@@ -27,7 +27,7 @@ class WordCount extends HTMLParagraphElement {
     super();
 
     // Constructor contents omitted for brevity
-    ...
+    // …
 
   }
 }

@@ -229,13 +229,13 @@ There are four `itemscope` attributes in the following example. Each `itemscope`
     Ingredients:<br>
     <span itemprop="recipeIngredient">Thinly-sliced apples: 6 cups<br></span>
     <span itemprop="recipeIngredient">White sugar: 3/4 cup<br></span>
-    ...
+    …
   </p>
   Directions: <br>
   <div itemprop="recipeInstructions">
     1. Cut and peel apples<br>
     2. Mix sugar and cinnamon. Use additional sugar for tart apples. <br>
-    ...
+    …
   </div>
 </div>
 ```

@@ -85,13 +85,13 @@ bash$ echo -n hello | base64
 This section describes problems that commonly occur when creating and using `data` URLs.
 
 ```
-data:text/html,lots of text...<p><a name%3D"bottom">bottom</a>?arg=val
+data:text/html,lots of text…<p><a name%3D"bottom">bottom</a>?arg=val
 ```
 
 This represents an HTML resource whose contents are:
 
 ```html
-lots of text...<p><a name="bottom">bottom</a>?arg=val
+lots of text…<p><a name="bottom">bottom</a>?arg=val
 ```
 
 - Syntax
-Original file line number
+Diff line change
@@ Expand Up @@
     var supportsVideo = !!document.createElement('video').canPlayType;
     if (supportsVideo) {
        // set up custom controls
-       // ...
+       // …
     }
     ```
@@ Expand Down @@