convert content to md

1 files changed, 51 insertions, 63 deletions

diff --git a/files/fr/web/api/canvasrenderingcontext2d/stroketext/index.md b/files/fr/web/api/canvasrenderingcontext2d/stroketext/index.md
index c1b20a2580..3778eedf4f 100644
--- a/files/fr/web/api/canvasrenderingcontext2d/stroketext/index.md
+++ b/files/fr/web/api/canvasrenderingcontext2d/stroketext/index.md
@@ -9,68 +9,69 @@ tags:
   - Reference
 translation_of: Web/API/CanvasRenderingContext2D/strokeText
 ---
-<div>{{APIRef}}</div>
+{{APIRef}}
 
-<p>La méthode <code><strong>CanvasRenderingContext2D.strokeText()</strong></code> de l'API Canvas 2D trace le texte fourni à la position donnée <em>(x, y)</em>. Si le quatrième paramètre optionnel indiquant une largeur maximale est fourni, le texte sera mis à l'échelle pour tenir dans cette cette largeur.</p>
+La méthode **`CanvasRenderingContext2D.strokeText()`** de l'API Canvas 2D trace le texte fourni à la position donnée _(x, y)_. Si le quatrième paramètre optionnel indiquant une largeur maximale est fourni, le texte sera mis à l'échelle pour tenir dans cette cette largeur.
 
-<p>Voir aussi la méthode {{domxref("CanvasRenderingContext2D.fillText()")}} pour dessiner un texte rempli.</p>
+Voir aussi la méthode {{domxref("CanvasRenderingContext2D.fillText()")}} pour dessiner un texte rempli.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">void <var><em>ctx</em>.strokeText(texte, x, y [, largeurMax]);</var>
-</pre>
+    void ctx.strokeText(texte, x, y [, largeurMax]);
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>texte</code></dt>
- <dd>Le texte à tracer en utilisant les valeurs en cours de {{domxref("CanvasRenderingContext2D.font","font")}}, {{domxref("CanvasRenderingContext2D.textAlign","textAlign")}}, {{domxref("CanvasRenderingContext2D.textBaseline","textBaseline")}}, et {{domxref("CanvasRenderingContext2D.direction","direction")}}.</dd>
-</dl>
+- `texte`
+  - : Le texte à tracer en utilisant les valeurs en cours de {{domxref("CanvasRenderingContext2D.font","font")}}, {{domxref("CanvasRenderingContext2D.textAlign","textAlign")}}, {{domxref("CanvasRenderingContext2D.textBaseline","textBaseline")}}, et {{domxref("CanvasRenderingContext2D.direction","direction")}}.
 
-<dl>
- <dt><code>x</code></dt>
- <dd>La coordonnée sur l'axe des x du point de départ du texte.</dd>
- <dt><code>y</code></dt>
- <dd>La coordonnée sur l'axe des y du point de départ du texte.</dd>
- <dt><code>largeurMax</code> {{optional_inline}}</dt>
- <dd>La largeur maximum à dessiner.  Si spécifiée et si la chaîne est calculée comme étant plus large que cette largeur, la police est ajustée pour utiliser une police plus condensée horizontalement (si une est disponible ou si une raisonnablement lisible lisible peut être synthétisée en mettant à l'échelle horizontalement la police courante), ou une police plus petite.</dd>
-</dl>
+<!---->
 
-<h2 id="Exemples">Exemples</h2>
+- `x`
+  - : La coordonnée sur l'axe des x du point de départ du texte.
+- `y`
+  - : La coordonnée sur l'axe des y du point de départ du texte.
+- `largeurMax` {{optional_inline}}
+  - : La largeur maximum à dessiner.  Si spécifiée et si la chaîne est calculée comme étant plus large que cette largeur, la police est ajustée pour utiliser une police plus condensée horizontalement (si une est disponible ou si une raisonnablement lisible lisible peut être synthétisée en mettant à l'échelle horizontalement la police courante), ou une police plus petite.
 
-<h3 id="Utilisation_de_la_méthode_strokeText">Utilisation de la méthode <code>strokeText</code></h3>
+## Exemples
 
-<p>Il ne s'agit que d'un extrait de code simple qui utilise la méthode <code>strokeText</code>.</p>
+### Utilisation de la méthode `strokeText`
 
-<h4 id="HTML">HTML</h4>
+Il ne s'agit que d'un extrait de code simple qui utilise la méthode `strokeText`.
 
-<pre class="brush: html">&lt;canvas id="canevas"&gt;&lt;/canvas&gt;
-</pre>
+#### HTML
 
-<h4 id="JavaScript">JavaScript</h4>
+```html
+<canvas id="canevas"></canvas>
+```
 
-<pre class="brush: js">var canevas = document.getElementById('canevas');
+#### JavaScript
+
+```js
+var canevas = document.getElementById('canevas');
 var ctx = canevas.getContext('2d');
 
 ctx.font = '48px serif';
 ctx.strokeText('Hello world', 50, 100);
-</pre>
+```
 
-<p>Modifiez le code ci-dessous et voyez vos modifications mises à jour en direct dans le canevas:</p>
+Modifiez le code ci-dessous et voyez vos modifications mises à jour en direct dans le canevas:
 
-<h4 id="code_jouable">Code jouable</h4>
+#### Code jouable
 
-<pre class="brush: html hidden">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="edit" type="button" value="Edit" /&gt;
-  &lt;input id="reset" type="button" value="Reset" /&gt;
-&lt;/div&gt;
-&lt;textarea id="code" class="playable-code"&gt;
+```html hidden
+<canvas id="canvas" width="400" height="200" class="playable-canvas"></canvas>
+<div class="playable-buttons">
+  <input id="edit" type="button" value="Edit" />
+  <input id="reset" type="button" value="Reset" />
+</div>
+<textarea id="code" class="playable-code">
 ctx.font = "48px serif";
-ctx.strokeText("Hello world", 50, 100);&lt;/textarea&gt;
-</pre>
+ctx.strokeText("Hello world", 50, 100);</textarea>
+```
 
-<pre class="brush: js hidden">var canvas = document.getElementById("canvas");
+```js hidden
+var canvas = document.getElementById("canvas");
 var ctx = canvas.getContext("2d");
 var textarea = document.getElementById("code");
 var reset = document.getElementById("reset");
@@ -93,34 +94,21 @@ edit.addEventListener("click", function() {
 
 textarea.addEventListener("input", drawCanvas);
 window.addEventListener("load", drawCanvas);
-</pre>
+```
 
-<p>{{ EmbedLiveSample('code_jouable', 700, 360) }}</p>
+{{ EmbedLiveSample('code_jouable', 700, 360) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-stroketext", "CanvasRenderingContext2D.strokeText")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                                                                                        | Statut                           | Commentaire |
+| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ----------- |
+| {{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-stroketext", "CanvasRenderingContext2D.strokeText")}} | {{Spec2('HTML WHATWG')}} |             |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<p>{{Compat("api.CanvasRenderingContext2D.strokeText")}}</p>
+{{Compat("api.CanvasRenderingContext2D.strokeText")}}
 
-<h2 id="Voir_aussi">Voir aussi</h2>
+## Voir aussi
 
-<ul>
- <li>L'interface la définissant, {{domxref("CanvasRenderingContext2D")}}</li>
- <li>{{domxref("CanvasRenderingContext2D.fillText()")}}</li>
-</ul>
+- L'interface la définissant, {{domxref("CanvasRenderingContext2D")}}
+- {{domxref("CanvasRenderingContext2D.fillText()")}}