convert content to md

2 files changed, 121 insertions, 160 deletions

diff --git a/files/fr/web/css/@page/index.md b/files/fr/web/css/@page/index.md
index 9d44d62546..563e341e7e 100644
--- a/files/fr/web/css/@page/index.md
+++ b/files/fr/web/css/@page/index.md
@@ -7,99 +7,74 @@ tags:
   - Règle @
 translation_of: Web/CSS/@page
 ---
-<div>{{CSSRef}}</div>
+{{CSSRef}}
 
-<p>La règle @ <strong><code>@page</code></strong> est utilisée afin de modifier certaines propriétés CSS lorsqu'on imprime un document. La règle <code>@page</code> ne permet par de modifier toutes les propriétés mais uniquement celles qui portent sur les marges, les lignes orphelines et veuves ainsi que les sauts de page du document. Si on utilise cette règle @ pour modifier une autre propriété, ce changement sera ignoré.</p>
+La règle @ **`@page`** est utilisée afin de modifier certaines propriétés CSS lorsqu'on imprime un document. La règle `@page` ne permet par de modifier toutes les propriétés mais uniquement celles qui portent sur les marges, les lignes orphelines et veuves ainsi que les sauts de page du document. Si on utilise cette règle @ pour modifier une autre propriété, ce changement sera ignoré.
 
-<pre class="brush: css no-line-numbers">@page {
+```css
+@page {
   margin: 1cm;
 }
 
 @page :first {
   margin: 2cm;
-}</pre>
+}
+```
+
+La règle @ `@page` peut être manipulée via le CSSOM, notamment avec l'interface {{domxref("CSSPageRule")}}.
 
-<p>La règle @ <code>@page</code> peut être manipulée via le CSSOM, notamment avec l'interface {{domxref("CSSPageRule")}}.</p>
+> **Note :** Le W3C est en train de discuter de la gestion des unités de longueur ({{cssxref("&lt;length&gt;")}}) relative à la zone d'affichage (_viewport_) : `vh`, `vw`, `vmin` et `vmax`. En attendant, il est conseillé de ne pas les utiliser au sein d'une règle `@page`.
 
-<div class="note">
-  <p><strong>Note :</strong> Le W3C est en train de discuter de la gestion des unités de longueur ({{cssxref("&lt;length&gt;")}}) relative à la zone d'affichage (<em>viewport</em>) : <code>vh</code>, <code>vw</code>, <code>vmin</code> et <code>vmax</code>. En attendant, il est conseillé de ne pas les utiliser au sein d'une règle <code>@page</code>.</p>
-</div>
+## Syntaxe
 
-<h2 id="Syntaxe">Syntaxe</h2>
+### Descripteurs
 
-<h3 id="Descripteurs">Descripteurs</h3>
+- [`size`](/fr/docs/Web/CSS/@page/size)
+  - : Définit la taille et l'orientation du bloc englobant la boîte de la page. En général, lorsqu'une boîte correspondant à une page est rendu sur une feuille, cela indique la taille de la page utilisée.
 
-<dl>
- <dt><a href="/fr/docs/Web/CSS/@page/size"><code>size</code></a></dt>
- <dd>Définit la taille et l'orientation du bloc englobant la boîte de la page. En général, lorsqu'une boîte correspondant à une page est rendu sur une feuille, cela indique la taille de la page utilisée.</dd>
-</dl>
+<!---->
 
-<dl>
- <dt><code><a href="/fr/docs/orphaned/Web/CSS/@page/marks">marks</a></code></dt>
- <dd>Ajoute des marques pour la découpe ou l'alignement des pages du document.</dd>
-</dl>
+- [`marks`](/fr/docs/orphaned/Web/CSS/@page/marks)
+  - : Ajoute des marques pour la découpe ou l'alignement des pages du document.
 
-<dl>
- <dt><a href="/fr/docs/orphaned/Web/CSS/@page/bleed"><code>bleed</code></a></dt>
- <dd>Définit la limite au-delà de la boîte de la page au-delà de laquelle le contenu affiché est rogné.</dd>
-</dl>
+<!---->
 
-<h3 id="Syntaxe_formelle">Syntaxe formelle</h3>
+- [`bleed`](/fr/docs/orphaned/Web/CSS/@page/bleed)
+  - : Définit la limite au-delà de la boîte de la page au-delà de laquelle le contenu affiché est rogné.
+
+### Syntaxe formelle
 
 {{csssyntax}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<pre class="brush: css">@page :first {
+```css
+@page :first {
   margin: 2cm 3cm;
-} </pre>
-
-<p>Pour d'autres exemples, voir les pages qui concernent les pseudo-classes liées à <code>@page</code> :</p>
-
-<ul>
- <li>{{cssxref(":blank")}}</li>
- <li>{{cssxref(":first")}}</li>
- <li>{{cssxref(":left")}}</li>
- <li>{{cssxref(":right")}}</li>
- <li>{{cssxref(":recto")}} {{experimental_inline}}</li>
- <li>{{cssxref(":verso")}} {{experimental_inline}}</li>
-</ul>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">État</th>
-   <th scope="col">Commentaires</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS Logical Properties', '#logical-page', ':recto and :verso')}}</td>
-   <td>{{Spec2('CSS Logical Properties')}}</td>
-   <td>Ajout des sélecteurs de page <code>:recto</code> et <code>:verso</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Paged Media', '#at-page-rule', '@page')}}</td>
-   <td>{{Spec2('CSS3 Paged Media')}}</td>
-   <td>Aucun changement depuis  {{SpecName('CSS2.1')}}, bien que plus de règles @ puissent être utilisées au sein d'une règle <code>@page</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS2.1', 'page.html#page-selectors', '@page')}}</td>
-   <td>{{Spec2('CSS2.1')}}</td>
-   <td>Définition initiale.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<p>{{Compat("css.at-rules.page")}}</p>
-
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<ul>
- <li><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=286443">Le bug de suivi Mozilla pour l'ensemble des fonctionnalités associées aux médias paginés.</a></li>
-</ul>
+}
+```
+
+Pour d'autres exemples, voir les pages qui concernent les pseudo-classes liées à `@page` :
+
+- {{cssxref(":blank")}}
+- {{cssxref(":first")}}
+- {{cssxref(":left")}}
+- {{cssxref(":right")}}
+- {{cssxref(":recto")}} {{experimental_inline}}
+- {{cssxref(":verso")}} {{experimental_inline}}
+
+## Spécifications
+
+| Spécification                                                                                        | État                                             | Commentaires                                                                                                                          |
+| ---------------------------------------------------------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------- |
+| {{SpecName('CSS Logical Properties', '#logical-page', ':recto and :verso')}} | {{Spec2('CSS Logical Properties')}} | Ajout des sélecteurs de page `:recto` et `:verso`.                                                                                    |
+| {{SpecName('CSS3 Paged Media', '#at-page-rule', '@page')}}                         | {{Spec2('CSS3 Paged Media')}}         | Aucun changement depuis  {{SpecName('CSS2.1')}}, bien que plus de règles @ puissent être utilisées au sein d'une règle `@page`. |
+| {{SpecName('CSS2.1', 'page.html#page-selectors', '@page')}}                     | {{Spec2('CSS2.1')}}                         | Définition initiale.                                                                                                                  |
+
+## Compatibilité des navigateurs
+
+{{Compat("css.at-rules.page")}}
+
+## Voir aussi
+
+- [Le bug de suivi Mozilla pour l'ensemble des fonctionnalités associées aux médias paginés.](https://bugzilla.mozilla.org/show_bug.cgi?id=286443)
diff --git a/files/fr/web/css/@page/size/index.md b/files/fr/web/css/@page/size/index.md
index 89d4723b4d..6cdf3c70a7 100644
--- a/files/fr/web/css/@page/size/index.md
+++ b/files/fr/web/css/@page/size/index.md
@@ -8,22 +8,23 @@ tags:
   - Reference
 translation_of: Web/CSS/@page/size
 ---
-<div>{{CSSRef}}{{SeeCompatTable}}</div>
+{{CSSRef}}{{SeeCompatTable}}
 
-<p>Le descripteur <strong><code>size</code></strong>, associé à la règle @ {{cssxref("@page")}}, permet de définir les dimensions et l'orientation de la boîte utilisée pour représenter une page. La plupart du temps, cette taille correspondra à la totalité de la taille de la page imprimée.</p>
+Le descripteur **`size`**, associé à la règle @ {{cssxref("@page")}}, permet de définir les dimensions et l'orientation de la boîte utilisée pour représenter une page. La plupart du temps, cette taille correspondra à la totalité de la taille de la page imprimée.
 
-<p>Les dimensions de cette boîte peuvent être définies de façon absolues ou relatives (dans ce cas, la page occupera l'espace disponible).</p>
+Les dimensions de cette boîte peuvent être définies de façon absolues ou relatives (dans ce cas, la page occupera l'espace disponible).
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush:css">/* Des mots-clés qui peuvent être utilisées
+```css
+/* Des mots-clés qui peuvent être utilisées
    pour remplir l'espace disponible         */
 size: auto;
 size: portrait;
 size: landscape;
 
 /* Des valeurs de longueur */
-/* Type &lt;length&gt;           */
+/* Type <length>           */
 /* 1 valeur : hauteur = largeur */
 size: 6in;
 
@@ -39,87 +40,72 @@ size: letter;
 
 /* Une déclaration incluant la taille et l'orientation */
 size: A4 portrait;
-</pre>
-
-<h3 id="Valeurs">Valeurs</h3>
-
-<dl>
- <dt><code>auto</code></dt>
- <dd>L'agent utilisateur décidera de la taille de page. En général, ce seront les dimensions de la page cible (celle sur laquelle imprimer/afficher) qui seront utilisées.</dd>
- <dt><code>landscape</code></dt>
- <dd>Le contenu de la page est affiché en paysage (le côté le plus long de la page sera le côté horizontal).</dd>
- <dt><code>portrait</code></dt>
- <dd>Le contenu de la page est affiché en portrait (le côté le plus long de la page sera le côté vertical).</dd>
- <dt><code>&lt;length&gt;</code></dt>
- <dd>Une valeur de longueur (cf. {{cssxref("&lt;length&gt;")}}). La première valeur utilisée correspond à la largeur de la boîte de la page et la deuxième correspond à la hauteur. Si une seule valeur est fournie, celle-ci sera utilisée pour la largeur et pour la hauteur.</dd>
- <dt><code>&lt;page-size&gt;</code></dt>
- <dd><p>Un mot-clé avec l'une des valeurs suivantes :</p>
- <dl>
-  <dt><code>A5</code></dt>
-  <dd>Ce mot-clé correspond aux dimensions ISO standard : 148mm x 210mm.</dd>
-  <dt><code>A4</code></dt>
-  <dd>Ce mot-clé correspond aux dimensions ISO standard : 210mm x 297mm (c'est le format le plus utilisé pour les impressions occasionnelles sur les imprimantes personnelles).</dd>
-  <dt><code>A3</code></dt>
-  <dd>Ce mot-clé correspond aux dimensions ISO standard : 297mm x 420mm.</dd>
-  <dt><code>B5</code></dt>
-  <dd>Ce mot-clé correspond aux dimensions ISO standard : 176mm x 250mm.</dd>
-  <dt><code>B4</code></dt>
-  <dd>Ce mot-clé correspond aux dimensions ISO standard : 250mm x 353mm.</dd>
-  <dt><code>JIS-B5</code></dt>
-  <dd>Ce mot-clé correspond aux dimensions JIS standard : 182mm x 257mm.</dd>
-  <dt><code>JIS-B4</code></dt>
-  <dd>Ce mot-clé correspond aux dimensions JIS standard : 257mm x 364mm.</dd>
-  <dt><code>letter</code></dt>
-  <dd>Ce mot-clé correspond à la taille standard du papier à lettre aux États-Unis : 8.5in x 11in.</dd>
-  <dt><code>legal</code></dt>
-  <dd>Ce mot-clé correspond à la taille standard des documents légaux aux États-Unis : 8.5in par 14in.</dd>
-  <dt><code>ledger</code></dt>
-  <dd>Ce mot-clé correspond à la taille standard des pages d'un livre en grand format aux États-Unis. Cela correspond à : 11in x 17in.</dd>
- </dl>
- </dd>
-</dl>
-
-<h2 id="Exemples">Exemples</h2>
-
-<pre class="brush: css">@page {
+```
+
+### Valeurs
+
+- `auto`
+  - : L'agent utilisateur décidera de la taille de page. En général, ce seront les dimensions de la page cible (celle sur laquelle imprimer/afficher) qui seront utilisées.
+- `landscape`
+  - : Le contenu de la page est affiché en paysage (le côté le plus long de la page sera le côté horizontal).
+- `portrait`
+  - : Le contenu de la page est affiché en portrait (le côté le plus long de la page sera le côté vertical).
+- `<length>`
+  - : Une valeur de longueur (cf. {{cssxref("&lt;length&gt;")}}). La première valeur utilisée correspond à la largeur de la boîte de la page et la deuxième correspond à la hauteur. Si une seule valeur est fournie, celle-ci sera utilisée pour la largeur et pour la hauteur.
+- `<page-size>`
+
+  - : Un mot-clé avec l'une des valeurs suivantes :
+
+    - `A5`
+      - : Ce mot-clé correspond aux dimensions ISO standard : 148mm x 210mm.
+    - `A4`
+      - : Ce mot-clé correspond aux dimensions ISO standard : 210mm x 297mm (c'est le format le plus utilisé pour les impressions occasionnelles sur les imprimantes personnelles).
+    - `A3`
+      - : Ce mot-clé correspond aux dimensions ISO standard : 297mm x 420mm.
+    - `B5`
+      - : Ce mot-clé correspond aux dimensions ISO standard : 176mm x 250mm.
+    - `B4`
+      - : Ce mot-clé correspond aux dimensions ISO standard : 250mm x 353mm.
+    - `JIS-B5`
+      - : Ce mot-clé correspond aux dimensions JIS standard : 182mm x 257mm.
+    - `JIS-B4`
+      - : Ce mot-clé correspond aux dimensions JIS standard : 257mm x 364mm.
+    - `letter`
+      - : Ce mot-clé correspond à la taille standard du papier à lettre aux États-Unis : 8.5in x 11in.
+    - `legal`
+      - : Ce mot-clé correspond à la taille standard des documents légaux aux États-Unis : 8.5in par 14in.
+    - `ledger`
+      - : Ce mot-clé correspond à la taille standard des pages d'un livre en grand format aux États-Unis. Cela correspond à : 11in x 17in.
+
+## Exemples
+
+```css
+@page {
   size: 4cm 6cm landscape;
 }
-</pre>
+```
 
-<pre class="brush: css">@media print {
+```css
+@media print {
   @page {
     size: 50mm 150mm;
   }
-}</pre>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">État</th>
-   <th scope="col">Commentaires</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS3 Paged Media', '#size', 'size')}}</td>
-   <td>{{Spec2('CSS3 Paged Media')}}</td>
-   <td>Définition initiale.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<p>{{Compat("css.at-rules.page.size")}}</p>
-
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<ul>
- <li>{{cssxref("@page/bleed", "bleed")}}</li>
- <li>{{cssxref("@page/marks", "marks")}}</li>
-</ul>
+}
+```
+
+## Spécifications
+
+| Spécification                                                    | État                                     | Commentaires         |
+| ---------------------------------------------------------------- | ---------------------------------------- | -------------------- |
+| {{SpecName('CSS3 Paged Media', '#size', 'size')}} | {{Spec2('CSS3 Paged Media')}} | Définition initiale. |
+
+{{cssinfo}}
+
+## Compatibilité des navigateurs
+
+{{Compat("css.at-rules.page.size")}}
+
+## Voir aussi
+
+- {{cssxref("@page/bleed", "bleed")}}
+- {{cssxref("@page/marks", "marks")}}