convert content to md

1 files changed, 72 insertions, 91 deletions

diff --git a/files/fr/web/api/htmlelement/hidden/index.md b/files/fr/web/api/htmlelement/hidden/index.md
index f54affe844..8cbd7090df 100644
--- a/files/fr/web/api/htmlelement/hidden/index.md
+++ b/files/fr/web/api/htmlelement/hidden/index.md
@@ -3,86 +3,87 @@ title: HTMLElement.hidden
 slug: Web/API/HTMLElement/hidden
 translation_of: Web/API/HTMLElement/hidden
 ---
-<div>{{ APIRef("HTML DOM") }}</div>
+{{ APIRef("HTML DOM") }}
 
-<p>La propriété <strong><code>hidden</code></strong> de l'{{domxref("HTMLElement")}} est un {{jsxref("Boolean")}} qui vaut <code>true</code> si l'élément est caché, sinon sa valeur est <code>false</code>. Cela est très différent de l'utilisation de la propriété CSS {{cssxref("display")}} pour contrôler la visibilité d'un élément.</p>
+La propriété **`hidden`** de l'{{domxref("HTMLElement")}} est un {{jsxref("Boolean")}} qui vaut `true` si l'élément est caché, sinon sa valeur est `false`. Cela est très différent de l'utilisation de la propriété CSS {{cssxref("display")}} pour contrôler la visibilité d'un élément.
 
-<p>La propriété <code>hidden</code> s'applique à tous les modes de présentation et ne doit pas être utilisée pour cacher du contenu qui est destiné à être directement accessible par l'utilisateur.</p>
+La propriété `hidden` s'applique à tous les modes de présentation et ne doit pas être utilisée pour cacher du contenu qui est destiné à être directement accessible par l'utilisateur.
 
-<p>Des cas d'utilisation appropriés de <code>hidden</code> comprennent :</p>
+Des cas d'utilisation appropriés de `hidden` comprennent :
 
-<ul>
- <li>du contenu qui n'est pas encore pertinent mais qui peut être nécessaire ultérieurement ;</li>
- <li>du contenu qui était nécessaire antérieurement mais qui ne l'est plus ;</li>
- <li>du contenu qui est réutilisé par d'autres parties de la page à la manière d'un modèle ;</li>
- <li>la création d'un canevas hors écran comme tampon de dessin.</li>
-</ul>
+- du contenu qui n'est pas encore pertinent mais qui peut être nécessaire ultérieurement ;
+- du contenu qui était nécessaire antérieurement mais qui ne l'est plus ;
+- du contenu qui est réutilisé par d'autres parties de la page à la manière d'un modèle ;
+- la création d'un canevas hors écran comme tampon de dessin.
 
-<p>Des cas inappropriés d'utilisation comprennent :</p>
+Des cas inappropriés d'utilisation comprennent :
 
-<ul>
- <li>le fait de cacher des panneaux dans une boîte de dialogue à onglets ;</li>
- <li>le fait de cacher du contenu dans une présentation tout en ayant l'intention qu'il soit visible dans d'autres.</li>
-</ul>
+- le fait de cacher des panneaux dans une boîte de dialogue à onglets ;
+- le fait de cacher du contenu dans une présentation tout en ayant l'intention qu'il soit visible dans d'autres.
 
-<div class="note">
-<p><strong>Note :</strong> Des éléments qui ne sont pas <code>hidden</code> ne doivent pas faire référence à des éléments qui le sont.</p>
-</div>
+> **Note :** Des éléments qui ne sont pas `hidden` ne doivent pas faire référence à des éléments qui le sont.
 
-<h2 id="Syntax">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox"><em>estCaché</em> = <em>HTMLElement</em>.hidden;
+    estCaché = HTMLElement.hidden;
 
-<em>HTMLElement</em>.hidden = true | false;</pre>
+    HTMLElement.hidden = true | false;
 
-<h3 id="Valeur">Valeur</h3>
+### Valeur
 
-<p>Un Boolean qui est <code>true</code> si l'élément est caché à la vue ; sinon, la valeur est <code>false</code>.</p>
+Un Boolean qui est `true` si l'élément est caché à la vue ; sinon, la valeur est `false`.
 
-<h2 id="Example">Exemple</h2>
+## Exemple
 
-<p>Voici un exemple où un bloc caché est utilisé pour contenir un message de remerciement qui est affiché après qu'un utilisateur a accepté une demande inhabituelle.</p>
+Voici un exemple où un bloc caché est utilisé pour contenir un message de remerciement qui est affiché après qu'un utilisateur a accepté une demande inhabituelle.
 
-<h3 id="JavaScript">JavaScript</h3>
+### JavaScript
 
-<pre class="brush: js">document.getElementById("boutonOk")
+```js
+document.getElementById("boutonOk")
         .addEventListener("click", function() {
   document.getElementById("bienvenue").hidden = true;
   document.getElementById("impressionnant").hidden = false;
-}, false);</pre>
+}, false);
+```
 
-<p>Ce code installe une gestionnaire pour le bouton "OK" du panneau de bienvenue, gestionnaire qui cache le panneau de bienvenue et rend le panneau de suite — ayant le curieux nom d'"impressionnant" — visible à sa place.</p>
+Ce code installe une gestionnaire pour le bouton "OK" du panneau de bienvenue, gestionnaire qui cache le panneau de bienvenue et rend le panneau de suite — ayant le curieux nom d'"impressionnant" — visible à sa place.
 
-<h3 id="HTML">HTML</h3>
+### HTML
 
-<p>Le code HTML pour les deux boîtes est montré ci-dessous.</p>
+Le code HTML pour les deux boîtes est montré ci-dessous.
 
-<h4 id="Le_panneau_bienvenue">Le panneau bienvenue</h4>
+#### Le panneau bienvenue
 
-<pre class="brush: html">&lt;div id="bienvenue" class="panneau"&gt;
-  &lt;h1&gt;Bienvenue à Machin.com !&lt;/h1&gt;
-  &lt;p&gt;En cliquant sur "OK", vous acceptez d'être impressionnant chaque jour !&lt;/p&gt;
-  &lt;button class="bouton" id="boutonOk"&gt;OK&lt;/button&gt;
-&lt;/div&gt;</pre>
+```html
+<div id="bienvenue" class="panneau">
+  <h1>Bienvenue à Machin.com !</h1>
+  <p>En cliquant sur "OK", vous acceptez d'être impressionnant chaque jour !</p>
+  <button class="bouton" id="boutonOk">OK</button>
+</div>
+```
 
-<p>Ce code HTML crée un panneau (dans un bloc {{HTMLElement("div")}}) qui accueille les utilisateurs sur un site et leur dit ce qu'ils acceptent en cliquant sur le bouton OK.</p>
+Ce code HTML crée un panneau (dans un bloc {{HTMLElement("div")}}) qui accueille les utilisateurs sur un site et leur dit ce qu'ils acceptent en cliquant sur le bouton OK.
 
-<h4 id="Le_panneau_de_suite">Le panneau de suite</h4>
+#### Le panneau de suite
 
-<p>Une fois que l'utilisateur a cliqué sur le bouton "OK" dans le panneau d'accueil, le code JavaScript échange les deux panneaux en changeant leurs valeurs respectives pour <code>hidden</code>. Le panneau de suite ressemble à ce qui suit en HTML:</p>
+Une fois que l'utilisateur a cliqué sur le bouton "OK" dans le panneau d'accueil, le code JavaScript échange les deux panneaux en changeant leurs valeurs respectives pour `hidden`. Le panneau de suite ressemble à ce qui suit en HTML:
 
-<pre class="brush: html">&lt;div id="impressionnant" class="panneau" hidden&gt;
-  &lt;h1&gt;Merci !&lt;/h1&gt;
-  &lt;p&gt;Merci &lt;strong&gt;vraiment&lt;/strong&gt; beaucoup d'avoir accepté d'être
+```html
+<div id="impressionnant" class="panneau" hidden>
+  <h1>Merci !</h1>
+  <p>Merci <strong>vraiment</strong> beaucoup d'avoir accepté d'être
   impressionnant aujourd'hui ! Maintenant, sortez et faites des choses impressionnantes
-  d'une façon impressionnante pour rendre le monde plus impressionnant !&lt;/p&gt;
-&lt;/div&gt;</pre>
+  d'une façon impressionnante pour rendre le monde plus impressionnant !</p>
+</div>
+```
 
-<h3 id="CSS">CSS</h3>
+### CSS
 
-<p>Le contenu est mis en forme en utilisant le CSS ci-dessous.</p>
+Le contenu est mis en forme en utilisant le CSS ci-dessous.
 
-<pre class="brush: css">.panneau {
+```css
+.panneau {
   font: 16px "Open Sans", Helvetica, Arial, sans-serif;
   border: 1px solid #22d;
   padding: 12px;
@@ -98,46 +99,26 @@ translation_of: Web/API/HTMLElement/hidden
 h1 {
   margin-top: 0;
   font-size: 175%;
-}</pre>
-
-<h3 id="Résultat">Résultat</h3>
-
-<p>{{ EmbedLiveSample('Example', 560, 200) }}</p>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<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', "interaction.html#dom-hidden", "HTMLElement.hidden")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "editing.html#the-hidden-attribute", "HTMLElement.hidden")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "editing.html#the-hidden-attribute", "HTMLElement.hidden")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<p>{{Compat("api.HTMLElement.hidden")}}</p>
-
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<ul>
- <li>{{domxref("Element.hidden")}}</li>
- <li>{{cssxref("display")}}</li>
-</ul>
+}
+```
+
+### Résultat
+
+{{ EmbedLiveSample('Example', 560, 200) }}
+
+## Spécifications
+
+| Spécification                                                                                                    | Statut                           | Commentaire |
+| ---------------------------------------------------------------------------------------------------------------- | -------------------------------- | ----------- |
+| {{SpecName('HTML WHATWG', "interaction.html#dom-hidden", "HTMLElement.hidden")}}     | {{Spec2('HTML WHATWG')}} |             |
+| {{SpecName('HTML5.1', "editing.html#the-hidden-attribute", "HTMLElement.hidden")}}     | {{Spec2('HTML5.1')}}     |             |
+| {{SpecName('HTML5 W3C', "editing.html#the-hidden-attribute", "HTMLElement.hidden")}} | {{Spec2('HTML5 W3C')}}     |             |
+
+## Compatibilité des navigateurs
+
+{{Compat("api.HTMLElement.hidden")}}
+
+## Voir aussi
+
+- {{domxref("Element.hidden")}}
+- {{cssxref("display")}}