Prepare Web API section for Markdown conversion (#2464)

* Remove summary classes and ids

* Remove unecessary hidden

* Remove useless span filled with useless attributes / ids

* Remove useless font

* Remove notranslate

* Remove id in other elements than headings

* Remove name attributes

* Remove <pre><code> for JS w/ language-js class

* Remove <pre><code> for HTML w/ language-html class

* Remove <pre><code> for other lang w/ language-* class

* Rm highlighted line in code samples

* fix links, internal, external, absolute URLs

* missing file from last commit

* Fix styles errors apart from table + some classes

* Fix notes and warnings (+ some other :x)

* fix typo during merge which broke a doc

* aand forgot a conflict

* fix remaining classes of errors except dls and images

* Fix dls

* Fix images (deki/mozillademos) and remaining style issues

* Remove script tag from svg file

* Remove script tag from svg fileS

* Compress SVG files for CI

2 files changed, 20 insertions, 22 deletions

diff --git a/files/fr/web/api/htmlimageelement/image/index.html b/files/fr/web/api/htmlimageelement/image/index.html
index a3c9157213..669d6095b2 100644
--- a/files/fr/web/api/htmlimageelement/image/index.html
+++ b/files/fr/web/api/htmlimageelement/image/index.html
@@ -9,7 +9,7 @@ translation_of: Web/API/HTMLImageElement/Image
 ---
 <div>{{ APIRef("HTML DOM") }}</div>
 
-<p id="Image_Element_constructor">Le constructeur <strong><code>Image()</code></strong> crée une nouvelle instance {{domxref("HTMLImageElement")}} .</p>
+<p>Le constructeur <strong><code>Image()</code></strong> crée une nouvelle instance {{domxref("HTMLImageElement")}} .</p>
 
 <p>C'est fonctionnellement équivalent à {{domxref("Document.createElement()", "document.createElement('img')")}}.</p>
 
@@ -26,21 +26,19 @@ translation_of: Web/API/HTMLImageElement/Image
  <dd>La hauteur de l'image (c'est-à-dire, la valeur pour l'attribut {{htmlattrxref("height", "img")}}).</dd>
 </dl>
 
-<h2 id="Exemples"><span style="line-height: 1.572;">Exemples</span></h2>
+<h2 id="Exemples">Exemples</h2>
 
 <pre class="brush: js">var myImage = new Image(100, 200);
 myImage.src = 'picture.jpg';
 console.log(myImage);</pre>
 
-<div><span id="result_box" lang="fr"><span>Cela équivaudrait à définir la balise HTML suivante dans le</span></span> {{htmlelement("body")}} (<em>corps</em>) :</div>
+<div>Cela équivaudrait à définir la balise HTML suivante dans le {{htmlelement("body")}} (<em>corps</em>) :</div>
 
 <pre class="brush: html">&lt;img width="100" height="200" src="picture.jpg"&gt;
 </pre>
 
-<div> </div>
-
 <div class="note">
-<p><strong>Note </strong>: Le "bitmap" entier est chargé quelle que soit la taille spécifiée dans le constructeur. Si une taille est spécifiée dans le constructeur, elle sera reflétée dans les propriétés {{domxref("HTMLImageElement.width")}} et {{domxref("HTMLImageElement.height")}} de l'instance résultante. La largeur intrinsèque et la hauteur de l'image en pixels CSS sont reflétées à travers les propriétés {{domxref("HTMLImageElement.naturalWidth")}} et {{domxref("HTMLImageElement.naturalHeight")}}. Si aucune taille n'est spécifiée dans le constructeur, les deux paires de ces propriétés auront les mêmes valeurs.</p>
+<p><strong>Note :</strong> Le "bitmap" entier est chargé quelle que soit la taille spécifiée dans le constructeur. Si une taille est spécifiée dans le constructeur, elle sera reflétée dans les propriétés {{domxref("HTMLImageElement.width")}} et {{domxref("HTMLImageElement.height")}} de l'instance résultante. La largeur intrinsèque et la hauteur de l'image en pixels CSS sont reflétées à travers les propriétés {{domxref("HTMLImageElement.naturalWidth")}} et {{domxref("HTMLImageElement.naturalHeight")}}. Si aucune taille n'est spécifiée dans le constructeur, les deux paires de ces propriétés auront les mêmes valeurs.</p>
 </div>
 
 <h2 id="Spécifications">Spécifications</h2>
diff --git a/files/fr/web/api/htmlimageelement/index.html b/files/fr/web/api/htmlimageelement/index.html
index 8ffe240cfb..cc2ab84054 100644
--- a/files/fr/web/api/htmlimageelement/index.html
+++ b/files/fr/web/api/htmlimageelement/index.html
@@ -9,7 +9,7 @@ translation_of: Web/API/HTMLImageElement
 
 <h2 id="Propriétés">Propriétés</h2>
 
-<p><em><span id="result_box" lang="fr"><span>Hérite les propriétés de son parent, {{domxref ("HTMLElement")}}</span></span></em></p>
+<p><em>Hérite les propriétés de son parent, {{domxref ("HTMLElement")}}</em></p>
 
 <dl>
  <dt>{{domxref("HTMLImageElement.align")}} {{obsolete_inline}}</dt>
@@ -21,7 +21,7 @@ translation_of: Web/API/HTMLImageElement
  <dt>{{domxref("HTMLImageElement.complete")}} {{readonlyInline}}</dt>
  <dd>Retourne un {{domxref("Boolean")}} <em>(booléen)</em> qui est <code>true</code> <em>(vrai)</em> si le navigateur a fini de chercher l'image, que ce soit avec succès ou non. Il affiche aussi "true" si l'image n'a pas de valeur {{domxref("HTMLImageElement.src", "src")}} .</dd>
  <dt>{{domxref("HTMLImageElement.crossOrigin")}}</dt>
- <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères) </em> représentant le paramètre CORS défini pour cet élément image. Voir <a href="https://developer.mozilla.org/fr/docs/Web/HTML/Reglages_des_attributs_CORS">Attributs de règlage du CORS</a> pour plus de détails.</dd>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères) </em> représentant le paramètre CORS défini pour cet élément image. Voir <a href="/fr/docs/Web/HTML/Reglages_des_attributs_CORS">Attributs de règlage du CORS</a> pour plus de détails.</dd>
  <dt>{{domxref("HTMLImageElement.currentSrc")}} {{readonlyInline}}{{experimental_inline}}</dt>
  <dd>Retourne une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> représentant l'URL de l'image courante affichée (qui peut changer, par exemple en réponse à une requête multimédia).</dd>
  <dt>{{domxref("HTMLImageElement.height")}}</dt>
@@ -33,13 +33,13 @@ translation_of: Web/API/HTMLImageElement
  <dt>{{domxref("HTMLImageElement.longDesc")}} {{obsolete_inline}}</dt>
  <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> représentant l'URL d'une longue description de l'image.</dd>
  <dt>{{domxref("HTMLImageElement.lowSrc")}} {{obsolete_inline}}</dt>
- <dd>Est une {{domxref("DOMString")}}  <em>(chaîne de caractères)</em> qui <span id="result_box" lang="fr"><span> fait référence à une copie de faible qualité (mais plus rapide à charger) de l'image.</span></span></dd>
+ <dd>Est une {{domxref("DOMString")}}  <em>(chaîne de caractères)</em> qui  fait référence à une copie de faible qualité (mais plus rapide à charger) de l'image.</dd>
  <dt>{{domxref("HTMLImageElement.name")}} {{obsolete_inline}}</dt>
  <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> représentant le nom de l'élément.</dd>
  <dt>{{domxref("HTMLImageElement.naturalHeight")}} {{readonlyInline}}</dt>
  <dd>Retourne un <code>unsigned long</code>  représentant la hauteur intrinsèque de l'image en pixels CSS, si elle est disponible ; sinon, 0 est affiché.</dd>
  <dt>{{domxref("HTMLImageElement.referrerPolicy")}} {{experimental_inline}}</dt>
- <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> qui reflète l'attribut HTML {{htmlattrxref("referrerpolicy", "img")}}  <span id="result_box" lang="fr"><span>indiquant la référence à utiliser pour récupérer l'image.</span></span></dd>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> qui reflète l'attribut HTML {{htmlattrxref("referrerpolicy", "img")}}  indiquant la référence à utiliser pour récupérer l'image.</dd>
  <dt>{{domxref("HTMLImageElement.src")}}</dt>
  <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> qui reflète l'attribut HTML  {{htmlattrxref("src", "img")}} contenant l'URL complète de l'image y compris l'URI de base.</dd>
  <dt>{{domxref("HTMLImageElement.sizes")}} {{experimental_inline}}</dt>
@@ -64,7 +64,7 @@ translation_of: Web/API/HTMLImageElement
 
 <dl>
  <dt>{{domxref("HTMLImageElement.Image()", "Image()")}}</dt>
- <dd>Le constructeur d'image, comprend<span id="result_box" lang="fr"><span> deux propriétés </span></span> <code>unsigned</code>  et <code>long</code> <span lang="fr"><span>, qui sont la largeur et la hauteur de la ressource, et crée une instance de </span></span> <code>HTMLImageElement</code> <span lang="fr"><span>, non insérée dans une arborescence DOM.</span></span></dd>
+ <dd>Le constructeur d'image, comprend deux propriétés  <code>unsigned</code>  et <code>long</code> , qui sont la largeur et la hauteur de la ressource, et crée une instance de  <code>HTMLImageElement</code> , non insérée dans une arborescence DOM.</dd>
 </dl>
 
 <h2 id="Erreurs">Erreurs</h2>
@@ -81,20 +81,20 @@ translation_of: Web/API/HTMLImageElement
 
 <h2 id="Exemple">Exemple</h2>
 
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> img1 <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Image</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">//  Constructeur HTML5</span>
-img1<span class="punctuation token">.</span>src <span class="operator token">=</span> <span class="string token">'image1.png'</span><span class="punctuation token">;</span>
-img1<span class="punctuation token">.</span>alt <span class="operator token">=</span> <span class="string token">'alt'</span><span class="punctuation token">;</span>
-document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>img1<span class="punctuation token">)</span><span class="punctuation token">;</span></code>
+<pre class="brush: js">var img1 = new Image(); //  Constructeur HTML5
+img1.src = 'image1.png';
+img1.alt = 'alt';
+document.body.appendChild(img1);
 
-<span class="keyword token">var</span> img2 <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">'img'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// utilise DOM HTMLImageElement</span>
-img2<span class="punctuation token">.</span>src <span class="operator token">=</span> <span class="string token">'image2.jpg'</span><span class="punctuation token">;</span>
-img2<span class="punctuation token">.</span>alt <span class="operator token">=</span> <span class="string token">'alt text'</span><span class="punctuation token">;</span>
-document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>img2<span class="punctuation token">)</span><span class="punctuation token">;</span>
+var img2 = document.createElement('img'); // utilise DOM HTMLImageElement
+img2.src = 'image2.jpg';
+img2.alt = 'alt text';
+document.body.appendChild(img2);
 
-<span class="comment token">// en utilisant la première image dans le document</span>
-<span class="function token">alert</span><span class="punctuation token">(</span>document<span class="punctuation token">.</span>images<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">.</span>src<span class="punctuation token">)</span><span class="punctuation token">;</span></pre>
+// en utilisant la première image dans le document
+alert(document.images[0].src);</pre>
 
-<h2 class="brush: js line-numbers  language-js" id="Spécifications">Spécifications</h2>
+<h2 id="Spécifications">Spécifications</h2>
 
 <table class="standard-table">
  <tbody>