convert content to md

1 files changed, 65 insertions, 80 deletions

diff --git a/files/fr/web/css/text-shadow/index.md b/files/fr/web/css/text-shadow/index.md
index 359a0acb0e..7df9a97ea6 100644
--- a/files/fr/web/css/text-shadow/index.md
+++ b/files/fr/web/css/text-shadow/index.md
@@ -7,15 +7,16 @@ tags:
   - Reference
 translation_of: Web/CSS/text-shadow
 ---
-<div>{{CSSRef}}</div>
+{{CSSRef}}
 
-<p>La propriété <strong><code>text-shadow</code></strong> ajoute des ombres au texte. Elle accepte une liste d'ombres à appliquer au texte et aux <a href="/fr/docs/Web/CSS/text-decoration">décorations</a> de l'élément. Chaque ombre est décrite par une certaine combinaison de décalages X et Y de l'élément, de rayon de flou et de couleur.</p>
+La propriété **`text-shadow`** ajoute des ombres au texte. Elle accepte une liste d'ombres à appliquer au texte et aux [décorations](/fr/docs/Web/CSS/text-decoration) de l'élément. Chaque ombre est décrite par une certaine combinaison de décalages X et Y de l'élément, de rayon de flou et de couleur.
 
-<div>{{EmbedInteractiveExample("pages/css/text-shadow.html")}}</div>
+{{EmbedInteractiveExample("pages/css/text-shadow.html")}}
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush:css no-line-numbers">/* offset-x | offset-y | blur-radius | color */
+```css
+/* offset-x | offset-y | blur-radius | color */
 text-shadow: 1px 1px 2px black;
 
 /* color | offset-x | offset-y | blur-radius */
@@ -35,101 +36,85 @@ text-shadow: 5px 10px;
 text-shadow: inherit;
 text-shadow: initial;
 text-shadow: unset;
-</pre>
+```
 
-<p>Cette propriété est spécifiée comme une liste d'ombres séparées par des virgules.</p>
+Cette propriété est spécifiée comme une liste d'ombres séparées par des virgules.
 
-<p>Chaque ombre est spécifiée par deux ou trois valeurs <code>&lt;length&gt;</code>, suivies d'une valeur <code>&lt;color&gt;</code>. Les deux premières valeurs <code>&lt;length&gt;</code> sont les valeurs <code>&lt;decalage-x&gt;</code> et <code>&lt;decalage-y&gt;</code>. La troisième valeur <code>&lt;length&gt;</code>, facultative, est le <code>&lt;rayon-de-flou&gt;</code>. La valeur <code>&lt;color&gt;</code> est la couleur de l'ombre.</p>
+Chaque ombre est spécifiée par deux ou trois valeurs `<length>`, suivies d'une valeur `<color>`. Les deux premières valeurs `<length>` sont les valeurs `<decalage-x>` et `<decalage-y>`. La troisième valeur `<length>`, facultative, est le `<rayon-de-flou>`. La valeur `<color>` est la couleur de l'ombre.
 
-<p>Lorsque plus d'une ombre est indiquée, les ombres sont appliquées d'avant en arrière, avec la première ombre spécifiée sur le dessus.</p>
+Lorsque plus d'une ombre est indiquée, les ombres sont appliquées d'avant en arrière, avec la première ombre spécifiée sur le dessus.
 
-<p>Cette propriété s'applique aux deux <a href="/fr/docs/Web/CSS/Pseudo-éléments">pseudo-éléments</a> {{cssxref("::first-line")}} et {{cssxref("::first-letter")}}.</p>
+Cette propriété s'applique aux deux [pseudo-éléments](/fr/docs/Web/CSS/Pseudo-éléments) {{cssxref("::first-line")}} et {{cssxref("::first-letter")}}.
 
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
 
-<dl>
- <dt>{{cssxref("&lt;color&gt;")}}</dt>
- <dd>Optionnelle. La couleur de l'ombre. Elle peut être spécifiée avant ou après les valeurs de décalage. Si non spécifiée, la valeur de la couleur est laissée à l'agent utilisateur, donc quand une cohérence entre les navigateurs est désirée, vous devriez la définir explicitement.</dd>
- <dt>&lt;decalage-x&gt; &lt;decalage-y&gt;</dt>
- <dd>Obligatoires. Ces valeurs {{cssxref("&lt;length&gt;")}} définissent la distance de l'ombre par rapport au texte. <code>&lt;decalage-x&gt;</code> définit la distance horizontale ; une valeur négative place l'ombre à gauche du texte. <code>&lt;decalage-y&gt;</code> définit la distance verticale ; une valeur négative place l'ombre au-dessus du texte. Si les deux valeurs sont à <code>0</code>, l'ombre sera placée exactement derrière le texte, bien qu'elle puisse être partiellement visible du fait de l'effet du <code>&lt;rayon-de-flou&gt;</code>).</dd>
- <dt>&lt;rayon-de-flou&gt;</dt>
- <dd>Optionnel. C'est une valeur {{cssxref("&lt;length&gt;")}}). Plus la valeur sera élevée, plus le flou sera important ; l'ombre deviendra plus large et plus légère. Si non utilisée, elle a pour défaut <code>0</code>.</dd>
-</dl>
+- {{cssxref("&lt;color&gt;")}}
+  - : Optionnelle. La couleur de l'ombre. Elle peut être spécifiée avant ou après les valeurs de décalage. Si non spécifiée, la valeur de la couleur est laissée à l'agent utilisateur, donc quand une cohérence entre les navigateurs est désirée, vous devriez la définir explicitement.
+- \<decalage-x> \<decalage-y>
+  - : Obligatoires. Ces valeurs {{cssxref("&lt;length&gt;")}} définissent la distance de l'ombre par rapport au texte. `<decalage-x>` définit la distance horizontale ; une valeur négative place l'ombre à gauche du texte. `<decalage-y>` définit la distance verticale ; une valeur négative place l'ombre au-dessus du texte. Si les deux valeurs sont à `0`, l'ombre sera placée exactement derrière le texte, bien qu'elle puisse être partiellement visible du fait de l'effet du `<rayon-de-flou>`).
+- \<rayon-de-flou>
+  - : Optionnel. C'est une valeur {{cssxref("&lt;length&gt;")}}). Plus la valeur sera élevée, plus le flou sera important ; l'ombre deviendra plus large et plus légère. Si non utilisée, elle a pour défaut `0`.
 
-<h3 id="Syntaxe_formelle">Syntaxe formelle</h3>
+### Syntaxe formelle
 
 {{csssyntax}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<h3 id="ombre_simple">Ombre simple</h3>
+### Ombre simple
 
-
-<pre class="brush: css">.red-text-shadow {
+```css
+.red-text-shadow {
    text-shadow: red 0 -2px;
-}</pre>
+}
+```
 
-<pre class="brush: html">&lt;p class="red-text-shadow"&gt;Sed ut perspiciatis unde omnis iste
+```html
+<p class="red-text-shadow">Sed ut perspiciatis unde omnis iste
     natus error sit voluptatem accusantium doloremque laudantium,
-    totam rem aperiam, eaque ipsa quae ab illo inventore.&lt;/p&gt;</pre>
+    totam rem aperiam, eaque ipsa quae ab illo inventore.</p>
+```
 
-<p>{{EmbedLiveSample('ombre_simple', '660px', '90px')}}</p>
+{{EmbedLiveSample('ombre_simple', '660px', '90px')}}
 
-<h3 id="ombres_multiples">Ombres multiples</h3>
+### Ombres multiples
 
-<pre class="brush:css">.white-text-with-blue-shadow {
+```css
+.white-text-with-blue-shadow {
    text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue;
    color: white;
    font: 1.5em Georgia, serif;
-}</pre>
+}
+```
 
-<pre class="brush: html">&lt;p class="white-text-with-blue-shadow"&gt;Sed ut perspiciatis unde omnis iste
+```html
+<p class="white-text-with-blue-shadow">Sed ut perspiciatis unde omnis iste
     natus error sit voluptatem accusantium doloremque laudantium,
-    totam rem aperiam, eaque ipsaquae ab illo inventore.&lt;/p&gt;</pre>
-
-<p>{{EmbedLiveSample('ombres_multiples', '660px', '170px')}}</p>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS3 Transitions', '#animatable-css', 'text-shadow')}}</td>
-   <td>{{Spec2('CSS3 Transitions')}}</td>
-   <td>Spécifie <code>text-shadow</code> comme animable.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Text Decoration', '#text-shadow', 'text-shadow')}}</td>
-   <td>{{Spec2('CSS3 Text Decoration')}}</td>
-   <td>La propriété CSS <code>text-shadow</code> était <a href="https://www.w3.org/TR/2008/REC-CSS2-20080411/text.html#text-shadow-props">incorrectement définie dans CSS2</a> et fut abandonnée dans CSS2 (Level 1). La spéc CSS Text Module Level 3 a raffiné la syntaxe. Ensuite, elle a été déplacée dans <a href="https://www.w3.org/TR/css-text-decor-3/">CSS Text Decoration Module Level 3</a>.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<p>{{Compat("css.properties.text-shadow")}}</p>
-
-<h3 id="Notes_CSS_Quantum">Notes CSS Quantum</h3>
-
-<ul>
- <li>Gecko présente un bug en raison duquel les {{cssxref("transition")}}s ne fonctionnent pas lors d'une transition entre une <code>text-shadow</code> avec une couleur spécifiée et une <code>ext-shadow</code> sans couleur spécifiée ({{bug(726550)}}). Cela a été corrigé dans le nouveau moteur CSS (aussi connu comme <a href="https://wiki.mozilla.org/Quantum">Quantum CSS</a> ou <a href="https://wiki.mozilla.org/Quantum/Stylo">Stylo</a>), prévu pour être disponible dans Firefox 57.</li>
-</ul>
-
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<ul>
- <li><a href="https://cssgenerator.org/text-shadow-css-generator.html">Text Shadow Generator</a> - Un générateur CSS d'ombre de texte interactif</li>
- <li>{{cssxref("box-shadow")}}</li>
- <li>Le type de données {{cssxref("&lt;color&gt;")}} (pour spécifier la couleur d'ombre)</li>
- <li><a href="/fr/docs/Web/HTML/Applying_color">Appliquer des couleurs sur des éléments HTML</a></li>
-</ul>
+    totam rem aperiam, eaque ipsaquae ab illo inventore.</p>
+```
+
+{{EmbedLiveSample('ombres_multiples', '660px', '170px')}}
+
+## Spécifications
+
+| Spécification                                                                            | Statut                                       | Commentaire                                                                                                                                                                                                                                                                                                                                                     |
+| ---------------------------------------------------------------------------------------- | -------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| {{SpecName('CSS3 Transitions', '#animatable-css', 'text-shadow')}} | {{Spec2('CSS3 Transitions')}}     | Spécifie `text-shadow` comme animable.                                                                                                                                                                                                                                                                                                                          |
+| {{SpecName('CSS3 Text Decoration', '#text-shadow', 'text-shadow')}} | {{Spec2('CSS3 Text Decoration')}} | La propriété CSS `text-shadow` était [incorrectement définie dans CSS2](https://www.w3.org/TR/2008/REC-CSS2-20080411/text.html#text-shadow-props) et fut abandonnée dans CSS2 (Level 1). La spéc CSS Text Module Level 3 a raffiné la syntaxe. Ensuite, elle a été déplacée dans [CSS Text Decoration Module Level 3](https://www.w3.org/TR/css-text-decor-3/). |
+
+{{cssinfo}}
+
+## Compatibilité des navigateurs
+
+{{Compat("css.properties.text-shadow")}}
+
+### Notes CSS Quantum
+
+- Gecko présente un bug en raison duquel les {{cssxref("transition")}}s ne fonctionnent pas lors d'une transition entre une `text-shadow` avec une couleur spécifiée et une `ext-shadow` sans couleur spécifiée ({{bug(726550)}}). Cela a été corrigé dans le nouveau moteur CSS (aussi connu comme [Quantum CSS](https://wiki.mozilla.org/Quantum) ou [Stylo](https://wiki.mozilla.org/Quantum/Stylo)), prévu pour être disponible dans Firefox 57.
+
+## Voir aussi
+
+- [Text Shadow Generator](https://cssgenerator.org/text-shadow-css-generator.html) - Un générateur CSS d'ombre de texte interactif
+- {{cssxref("box-shadow")}}
+- Le type de données {{cssxref("&lt;color&gt;")}} (pour spécifier la couleur d'ombre)
+- [Appliquer des couleurs sur des éléments HTML](/fr/docs/Web/HTML/Applying_color)