convert content to md

24 files changed, 682 insertions, 831 deletions

diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/index.md
index 70c32fc4f4..c20574d11a 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/index.md
@@ -12,36 +12,32 @@ tags:
   - devtools.panels
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools
 ---
-<p>{{AddonSidebar}}</p>
+{{AddonSidebar}}
 
-<p>Permet aux extensions d'interagir avec le {{Glossary("Developer Tools")}} du navigateur. Vous pouvez utiliser cette API pour créer des pages d'outils de développement, interagir avec la fenêtre qui est inspectée, inspecter l'utilisation du réseau de pages.</p>
+Permet aux extensions d'interagir avec le {{Glossary("Developer Tools")}} du navigateur. Vous pouvez utiliser cette API pour créer des pages d'outils de développement, interagir avec la fenêtre qui est inspectée, inspecter l'utilisation du réseau de pages.
 
-<p>Pour utiliser cette API, vous devez disposer de la <a href="/fr/Add-ons/WebExtensions/manifest.json/permissions#API_permissions">permission API</a> <code>"devtools"</code> spécifiée dans votre fichier <a href="/fr/docs/Mozilla/Add-ons/WebExtensions/manifest.json">manifest.json</a>. Cette permission ne peut pas être facultative.</p>
+Pour utiliser cette API, vous devez disposer de la [permission API](/fr/Add-ons/WebExtensions/manifest.json/permissions#API_permissions) `"devtools"` spécifiée dans votre fichier [manifest.json](/fr/docs/Mozilla/Add-ons/WebExtensions/manifest.json). Cette permission ne peut pas être facultative.
 
-<h2 id="Interfaces">Interfaces</h2>
+## Interfaces
 
-<dl>
- <dt>{{WebExtAPIRef("devtools.inspectedWindow")}}</dt>
- <dd>Interagir avec la fenêtre à laquelle les outils de développement sont attachés (fenêtre inspectée). Cela inclut l'obtention de l'onglet ID pour la page inspectée, l'évaluation du code dans le contexte de la fenêtre inspectée, le rechargement de la page ou l'obtention de la liste des ressources dans la page.</dd>
- <dt>{{WebExtAPIRef("devtools.network")}}</dt>
- <dd>Obtenir des informations sur les requêtes de réseau associées à la fenêtre à laquelle les outils de développement sont attachés (la fenêtre inspectée).</dd>
- <dt>{{WebExtAPIRef("devtools.panels")}}</dt>
- <dd>Créer des panneaux d'interface utilisateur qui seront affichés dans les outils de développement de l'agent utilisateur.</dd>
-</dl>
+- {{WebExtAPIRef("devtools.inspectedWindow")}}
+  - : Interagir avec la fenêtre à laquelle les outils de développement sont attachés (fenêtre inspectée). Cela inclut l'obtention de l'onglet ID pour la page inspectée, l'évaluation du code dans le contexte de la fenêtre inspectée, le rechargement de la page ou l'obtention de la liste des ressources dans la page.
+- {{WebExtAPIRef("devtools.network")}}
+  - : Obtenir des informations sur les requêtes de réseau associées à la fenêtre à laquelle les outils de développement sont attachés (la fenêtre inspectée).
+- {{WebExtAPIRef("devtools.panels")}}
+  - : Créer des panneaux d'interface utilisateur qui seront affichés dans les outils de développement de l'agent utilisateur.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools")}}</p>
+{{Compat("webextensions.api.devtools")}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basé sur l'API  [`chrome.downloads`](https://developer.chrome.com/extensions/downloads) de Chromium.
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.
 
-<p>Cette API est basé sur l'API  <a href="https://developer.chrome.com/extensions/downloads"><code>chrome.downloads</code></a> de Chromium.</p>
-
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -68,5 +64,4 @@ translation_of: Mozilla/Add-ons/WebExtensions/API/devtools
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.md
index b0a63e7c22..e8b8329c9e 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.md
@@ -12,95 +12,87 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Exécute JavaScript dans la fenêtre à laquelle les devtools sont attachés.</p>
+Exécute JavaScript dans la fenêtre à laquelle les devtools sont attachés.
 
-<p>C'est un peu comme utiliser {{WebExtAPIRef("tabs.executeScript()")}} pour joindre un script de contenu, mais avec deux différences principales:</p>
+C'est un peu comme utiliser {{WebExtAPIRef("tabs.executeScript()")}} pour joindre un script de contenu, mais avec deux différences principales:
 
-<p>Tout d'abord, le JavaScript peut utiliser un ensemble de <a href="#Helpers">commandes spéciales que les navigateurs fournissent généralement dans leur implémentation de console devtools </a>: par exemple, en utilisant "$0" pour designer l'élément actuellement sélectionné dans l'inspecteur.</p>
+Tout d'abord, le JavaScript peut utiliser un ensemble de [commandes spéciales que les navigateurs fournissent généralement dans leur implémentation de console devtools ](#Helpers): par exemple, en utilisant "$0" pour designer l'élément actuellement sélectionné dans l'inspecteur.
 
-<p>Deuxièmement, le JavaScript que vous exécutez peut voir les modifications apportées à la page par des scripts que la page a chargés. Cela contraste avec les scripts de contenu, qui voient la page <a href="/fr/Add-ons/WebExtensions/Content_scripts#DOM_access">telle qu'elle existerait si aucun script de page n'était pas chargé</a>. Cependant, notez que l'isolement fourni par les scripts de contenu est une fonction de sécurité délibérée, destinée à rendre plus difficile la confusion ou la subversion des WebExtensions par des pages web malveillantes ou simplement non coopératives en redéfinissant les fonctions et les propriétés du DOM. Cela signifie que vous devez être très prudent si vous renoncez à cette protection en utilisant eval(), et devrait utiliser les scripts de contenu, sauf si vous devez utiliser eval().</p>
+Deuxièmement, le JavaScript que vous exécutez peut voir les modifications apportées à la page par des scripts que la page a chargés. Cela contraste avec les scripts de contenu, qui voient la page [telle qu'elle existerait si aucun script de page n'était pas chargé](/fr/Add-ons/WebExtensions/Content_scripts#DOM_access). Cependant, notez que l'isolement fourni par les scripts de contenu est une fonction de sécurité délibérée, destinée à rendre plus difficile la confusion ou la subversion des WebExtensions par des pages web malveillantes ou simplement non coopératives en redéfinissant les fonctions et les propriétés du DOM. Cela signifie que vous devez être très prudent si vous renoncez à cette protection en utilisant eval(), et devrait utiliser les scripts de contenu, sauf si vous devez utiliser eval().
 
-<p>Le script est évalué par défaut dans le cadre principal de la page. Le script doit évaluer une valeur qui peut être représentée comme JSON (ce qui signifie que, par exemple, il peut ne pas évaluer une fonction ou un objet contenant des fonctions). Par défaut, le script ne voit pas les scripts de contenu attachés à la page.</p>
+Le script est évalué par défaut dans le cadre principal de la page. Le script doit évaluer une valeur qui peut être représentée comme JSON (ce qui signifie que, par exemple, il peut ne pas évaluer une fonction ou un objet contenant des fonctions). Par défaut, le script ne voit pas les scripts de contenu attachés à la page.
 
-<p>Vous ne pouvez pas appeler eval() sur les fenêtres de navigateur privilégiées telles que "about: addons".</p>
+Vous ne pouvez pas appeler eval() sur les fenêtres de navigateur privilégiées telles que "about: addons".
 
-<p>Vous pouvez éventuellement fournir un paramètre d'options, qui comprend des options pour évaluer le script dans une image différente ou dans le contexte des scripts de contenu attachés. Notez que Firefox ne supporte pas encore le paramètre d'options.</p>
+Vous pouvez éventuellement fournir un paramètre d'options, qui comprend des options pour évaluer le script dans une image différente ou dans le contexte des scripts de contenu attachés. Notez que Firefox ne supporte pas encore le paramètre d'options.
 
-<p>La fonction eval() renvoie une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui résout le résultat évalué du script ou une erreur.</p>
+La fonction eval() renvoie une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui résout le résultat évalué du script ou une erreur.
 
-<h2 id="Aides">Aides</h2>
+## Aides
 
-<p>Le script accède à un certain nombre d'objets qui aident le script injecté à interagir avec les outils du développeur. Les assistants suivants sont actuellement pris en charge:</p>
+Le script accède à un certain nombre d'objets qui aident le script injecté à interagir avec les outils du développeur. Les assistants suivants sont actuellement pris en charge:
 
-<dl>
- <dt><code>$0</code></dt>
- <dd>Contient une référence à l'élément actuellement sélectionné dans l'inspecteur Devtools.</dd>
- <dt><code>inspect()</code></dt>
- <dd>Etant donné un objet, s'il s'agit d'un élément DOM dans la page, sélectionnez-le dans l'inspecteur devtools, sinon il crée un aperçu de l'objet dans la webconsole.</dd>
-</dl>
+- `$0`
+  - : Contient une référence à l'élément actuellement sélectionné dans l'inspecteur Devtools.
+- `inspect()`
+  - : Etant donné un objet, s'il s'agit d'un élément DOM dans la page, sélectionnez-le dans l'inspecteur devtools, sinon il crée un aperçu de l'objet dans la webconsole.
 
-<p><a href="#Examples">Voir quelques exemples.</a></p>
+[Voir quelques exemples.](#Examples)
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">var evaluating = browser.devtools.inspectedWindow.eval(
+```js
+var evaluating = browser.devtools.inspectedWindow.eval(
   expression,       // string
   options           // object
 )
-</pre>
-
-<h3 id="Paramètres">Paramètres</h3>
-
-<dl>
- <dt><code>expression</code></dt>
- <dd><code>string</code>. L'expression JavaScript à évaluer. La chaîne doit évaluer un objet qui peut être représenté comme JSON, ou une exception sera lancée. Par exemple, l'expression ne doit pas évaluer une fonction.</dd>
- <dt><code>options</code>{{optional_inline}}</dt>
- <dd><p><code>object</code>. Options pour la fonction  (Notez que Firefox ne supporte pas encore cette option), comme suit :</p>
- <dl>
-  <dt><code>frameURL</code>{{optional_inline}}</dt>
-  <dd><code>string</code>. L'URL du cadre dans lequel à évaluer l'expression. Si cela est supprimé, l'expression est évaluée dans la trame principale de la fenêtre.</dd>
-  <dt><code>useContentScriptContext</code>{{optional_inline}}</dt>
-  <dd><code>boolean</code>. Si c'est vrai, évaluez l'expression dans le contexte des scripts de contenu que cette extension a attachée à la page. Si vous définissez cette option, vous devez d'abord attacher certains scripts de contenu à la page ou une erreur Devtools sera lancée.</dd>
-  <dt><code>contextSecurityOrigin</code> {{optional_inline}}</dt>
-  <dd><code>string</code>. Evaluez l'expression dans le contexte d'un script de contenu attaché par une extension différente, dont l'origine correspond à la valeur donnée ici. Ces remplacements sont <code>useContentScriptContext</code>.</dd>
- </dl>
- </dd>
-</dl>
-
-<h3 id="Valeur_retournée">Valeur retournée</h3>
-
-<p>Une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui sera remplie avec un tableau contenant deux éléments.</p>
-
-<p>Si aucune erreur n'est survenue, l'élément 0 contiendra le résultat de l'évaluation de l'expression et l'élément 1 sera indéfini.</p>
-
-<p>Si une erreur s'est produite, l'élément 0 sera indéfini et l'élément 1 contiendra un objet donnant des détails sur l'erreur. Deux types différents d'erreurs sont distingués :</p>
-
-<ul>
- <li>Des erreurs rencontrées lors de l'évaluation du JavaScript (par exemple, des erreurs de syntaxe dans l'expression). Dans ce cas, l'élément 1 contiendra :
-  <ul>
-   <li>Une propriété boolean isException, définie sur true</li>
-   <li>Une valeur de propriété de chaîne, en donnant plus de détails.</li>
-  </ul>
- </li>
- <li>D'autres erreurs (par exemple, une expression qui évalue sur un objet qui ne peut pas être représenté comme JSON). Dans ce cas, l'élément 1 contiendra:
-  <ul>
-   <li>Une propriété booléenne isError, définie sur true</li>
-   <li>Un code de propriété de chaîne contenant un code d'erreur.</li>
-  </ul>
- </li>
-</ul>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<p>{{Compat("webextensions.api.devtools.inspectedWindow.eval")}}</p>
-
-<h2 id="Exemples">Exemples</h2>
-
-<p>Ceci teste si jQuery est défini dans la fenêtre inspectée et enregistre le résultat. Notez que cela ne fonctionnerait pas dans un script de contenu, car même si jQuery était défini, le script de contenu ne le verrait pas.</p>
-
-<pre class="brush: js">function handleError(error) {
+```
+
+### Paramètres
+
+- `expression`
+  - : `string`. L'expression JavaScript à évaluer. La chaîne doit évaluer un objet qui peut être représenté comme JSON, ou une exception sera lancée. Par exemple, l'expression ne doit pas évaluer une fonction.
+- `options`{{optional_inline}}
+
+  - : `object`. Options pour la fonction  (Notez que Firefox ne supporte pas encore cette option), comme suit :
+
+    - `frameURL`{{optional_inline}}
+      - : `string`. L'URL du cadre dans lequel à évaluer l'expression. Si cela est supprimé, l'expression est évaluée dans la trame principale de la fenêtre.
+    - `useContentScriptContext`{{optional_inline}}
+      - : `boolean`. Si c'est vrai, évaluez l'expression dans le contexte des scripts de contenu que cette extension a attachée à la page. Si vous définissez cette option, vous devez d'abord attacher certains scripts de contenu à la page ou une erreur Devtools sera lancée.
+    - `contextSecurityOrigin` {{optional_inline}}
+      - : `string`. Evaluez l'expression dans le contexte d'un script de contenu attaché par une extension différente, dont l'origine correspond à la valeur donnée ici. Ces remplacements sont `useContentScriptContext`.
+
+### Valeur retournée
+
+Une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui sera remplie avec un tableau contenant deux éléments.
+
+Si aucune erreur n'est survenue, l'élément 0 contiendra le résultat de l'évaluation de l'expression et l'élément 1 sera indéfini.
+
+Si une erreur s'est produite, l'élément 0 sera indéfini et l'élément 1 contiendra un objet donnant des détails sur l'erreur. Deux types différents d'erreurs sont distingués :
+
+- Des erreurs rencontrées lors de l'évaluation du JavaScript (par exemple, des erreurs de syntaxe dans l'expression). Dans ce cas, l'élément 1 contiendra :
+
+  - Une propriété boolean isException, définie sur true
+  - Une valeur de propriété de chaîne, en donnant plus de détails.
+
+- D'autres erreurs (par exemple, une expression qui évalue sur un objet qui ne peut pas être représenté comme JSON). Dans ce cas, l'élément 1 contiendra:
+
+  - Une propriété booléenne isError, définie sur true
+  - Un code de propriété de chaîne contenant un code d'erreur.
+
+## Compatibilité des navigateurs
+
+{{Compat("webextensions.api.devtools.inspectedWindow.eval")}}
+
+## Exemples
+
+Ceci teste si jQuery est défini dans la fenêtre inspectée et enregistre le résultat. Notez que cela ne fonctionnerait pas dans un script de contenu, car même si jQuery était défini, le script de contenu ne le verrait pas.
+
+```js
+function handleError(error) {
   if (error.isError) {
     console.log(`Devtools error: ${error.code}`);
   } else {
@@ -119,16 +111,18 @@ function handleResult(result) {
 
 const checkjQuery = "typeof jQuery != 'undefined'";
 
-evalButton.addEventListener("click", () =&gt; {
+evalButton.addEventListener("click", () => {
   browser.devtools.inspectedWindow.eval(checkjQuery)
     .then(handleResult);
-});</pre>
+});
+```
 
-<h3 id="Exemples_d'aide">Exemples d'aide</h3>
+### Exemples d'aide
 
-<p>Cela utilise l'aide de <code>$0</code> pour définir la couleur d'arrière-plan de l'élément, actuellement sélectionné dans l'inspecteur :</p>
+Cela utilise l'aide de `$0` pour définir la couleur d'arrière-plan de l'élément, actuellement sélectionné dans l'inspecteur :
 
-<pre class="brush: js">const evalButton = document.querySelector("#reddinate");
+```js
+const evalButton = document.querySelector("#reddinate");
 const evalString = "$0.style.backgroundColor = 'red'";
 
 function handleError(error) {
@@ -145,15 +139,16 @@ function handleResult(result) {
   }
 }
 
-evalButton.addEventListener("click", () =&gt; {
+evalButton.addEventListener("click", () => {
   browser.devtools.inspectedWindow.eval(evalString)
     .then(handleResult);
 });
-</pre>
+```
 
-<p>Cela utilise l'assistant l'inspection() pour sélectionner le premier élément &lt;h1&gt; dans la page:</p>
+Cela utilise l'assistant l'inspection() pour sélectionner le premier élément \<h1> dans la page:
 
-<pre class="brush: js">const inspectButton = document.querySelector("#inspect");
+```js
+const inspectButton = document.querySelector("#inspect");
 const inspectString = "inspect(document.querySelector('h1'))";
 
 function handleError(error) {
@@ -170,23 +165,21 @@ function handleResult(result) {
   }
 }
 
-inspectButton.addEventListener("click", () =&gt; {
+inspectButton.addEventListener("click", () => {
   browser.devtools.inspectedWindow.eval(inspectString)
     .then(handleResult);
 });
-</pre>
-
-<p>{{WebExtExamples}}</p>
-
-<div class="note"><p><strong>Note :</strong></p>
+```
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools"><code>chrome.devtools</code></a>.</p>
+{{WebExtExamples}}
 
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools`](https://developer.chrome.com/extensions/devtools).
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.
 
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -213,5 +206,4 @@ inspectButton.addEventListener("click", () =&gt; {
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.md
index ed589e5b7c..9109f49f92 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.md
@@ -11,73 +11,36 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow
 ---
-<div>{{AddonSidebar}}</div>
+{{AddonSidebar}}
 
-<div class="note">
-<p><strong>Note :</strong> Cette page décrit les API de développement de WebExtensions telles qu'elles existent dans Firefox 54. Bien que les API soient basées sur les <a href="https://developer.chrome.com/extensions/devtools">APIs de devtools de Chrome</a>, il existe encore de nombreuses fonctionnalités qui ne sont pas encore implémentées dans Firefox et ne sont donc pas documentées ici. Pour voir les fonctionnalités actuellement manquantes, regarder  <a href="/fr/Add-ons/WebExtensions/Using_the_devtools_APIs#Limitations_of_the_devtools_APIs">Limitations des APIs devtools</a>.</p>
-</div>
+> **Note :** Cette page décrit les API de développement de WebExtensions telles qu'elles existent dans Firefox 54. Bien que les API soient basées sur les [APIs de devtools de Chrome](https://developer.chrome.com/extensions/devtools), il existe encore de nombreuses fonctionnalités qui ne sont pas encore implémentées dans Firefox et ne sont donc pas documentées ici. Pour voir les fonctionnalités actuellement manquantes, regarder  [Limitations des APIs devtools](/fr/Add-ons/WebExtensions/Using_the_devtools_APIs#Limitations_of_the_devtools_APIs).
 
-<p>L'API <code>devtools.inspectedWindow</code> permet à un extension de devtools d'interagir avec la fenêtre sur laquelle les outils de développement sont attachés.</p>
+L'API `devtools.inspectedWindow` permet à un extension de devtools d'interagir avec la fenêtre sur laquelle les outils de développement sont attachés.
 
-<p>Comme toutes les APIs de <code>devtools</code>, cette API n'est disponible que pour exécuter le code dans le document défini dans la clé <a href="/fr/Add-ons/WebExtensions/manifest.json/devtools_page">devtools_page</a> du manifest.json, où dans d'autres documents devtools créés par l'extension (tels que le document hébergé par un panneau, l'extension créée). Voir <a href="/fr/Add-ons/WebExtensions/Extending_the_developer_tools">Extension des outils de développement </a> pour plus d'informations.</p>
+Comme toutes les APIs de `devtools`, cette API n'est disponible que pour exécuter le code dans le document défini dans la clé [devtools_page](/fr/Add-ons/WebExtensions/manifest.json/devtools_page) du manifest.json, où dans d'autres documents devtools créés par l'extension (tels que le document hébergé par un panneau, l'extension créée). Voir [Extension des outils de développement ](/fr/Add-ons/WebExtensions/Extending_the_developer_tools) pour plus d'informations.
 
-<h2 id="Propriétés">Propriétés</h2>
+## Propriétés
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.inspectedWindow/tabId">devtools.inspectedWindow.tabId</a></code></dt>
- <dd>L'ID de la fenêtre sur laquelle sont attachés les outils du développeur.</dd>
-</dl>
+- [`devtools.inspectedWindow.tabId`](/fr/Add-ons/WebExtensions/API/devtools.inspectedWindow/tabId)
+  - : L'ID de la fenêtre sur laquelle sont attachés les outils du développeur.
 
-<h2 id="Fonctions">Fonctions</h2>
+## Fonctions
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval">devtools.inspectedWindow.eval()</a></code></dt>
- <dd>Evaluez certains JavaScript dans la fenêtre de destination.</dd>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.inspectedWindow/reload">devtools.inspectedWindow.reload()</a></code></dt>
- <dd>Rechargez le document de la fenêtre destination.</dd>
-</dl>
+- [`devtools.inspectedWindow.eval()`](/fr/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval)
+  - : Evaluez certains JavaScript dans la fenêtre de destination.
+- [`devtools.inspectedWindow.reload()`](/fr/Add-ons/WebExtensions/API/devtools.inspectedWindow/reload)
+  - : Rechargez le document de la fenêtre destination.
 
-<h2 id="Comptatibilité_navigateur">Comptatibilité navigateur</h2>
+## Comptatibilité navigateur
 
-<p>{{Compat("webextensions.api.devtools.inspectedWindow")}}</p>
+{{Compat("webextensions.api.devtools.inspectedWindow")}}
 
-<p>{{WebExtExamples("h2")}}</p>
+{{WebExtExamples("h2")}}
 
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.inspectedWindow`](https://developer.chrome.com/extensions/devtools_inspectedWindow).
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.
 
-
-<div class="note"><p><strong>Note :</strong></p>
-
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_inspectedWindow"><code>chrome.devtools.inspectedWindow</code></a>.</p>
-
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
-
-<div class="hidden">
-<p>// Copyright 2015 The Chromium Authors. All rights reserved.<br>
- //<br>
- // Redistribution and use in source and binary forms, with or without<br>
- // modification, are permitted provided that the following conditions are<br>
- // met:<br>
- //<br>
- //    * Redistributions of source code must retain the above copyright<br>
- // notice, this list of conditions and the following disclaimer.<br>
- //    * Redistributions in binary form must reproduce the above<br>
- // copyright notice, this list of conditions and the following disclaimer<br>
- // in the documentation and/or other materials provided with the<br>
- // distribution.<br>
- //    * Neither the name of Google Inc. nor the names of its<br>
- // contributors may be used to endorse or promote products derived from<br>
- // this software without specific prior written permission.<br>
- //<br>
- // THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS<br>
- // "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT<br>
- // LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR<br>
- // A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT<br>
- // OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,<br>
- // SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT<br>
- // LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,<br>
- // DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY<br>
- // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT<br>
- // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE<br>
- // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.</p>
-</div>
+<div class="hidden"><p>// Copyright 2015 The Chromium Authors. All rights reserved.<br>//<br>// Redistribution and use in source and binary forms, with or without<br>// modification, are permitted provided that the following conditions are<br>// met:<br>//<br>//    * Redistributions of source code must retain the above copyright<br>// notice, this list of conditions and the following disclaimer.<br>//    * Redistributions in binary form must reproduce the above<br>// copyright notice, this list of conditions and the following disclaimer<br>// in the documentation and/or other materials provided with the<br>// distribution.<br>//    * Neither the name of Google Inc. nor the names of its<br>// contributors may be used to endorse or promote products derived from<br>// this software without specific prior written permission.<br>//<br>// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS<br>// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT<br>// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR<br>// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT<br>// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,<br>// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT<br>// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,<br>// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY<br>// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT<br>// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE<br>// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.</p></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.md
index ee1076553c..d615cc7ff6 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.md
@@ -12,62 +12,59 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/reload
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/reload
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Recharge la fenêtre à laquelle les devtools sont attachés.</p>
+Recharge la fenêtre à laquelle les devtools sont attachés.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">browser.devtools.inspectedWindow.reload(
+```js
+browser.devtools.inspectedWindow.reload(
   reloadOptions       // object
 )
-</pre>
+```
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>reloadOptions</code>{{optional_inline}}</dt>
- <dd><p><code>object</code>. Options pour la fonction, comme suit</p>
- <dl>
-  <dt><code>ignoreCache</code>{{optional_inline}}</dt>
-  <dd><code>boolean</code>. S'il est vrai, cela fait que le rechargement ignore le cache du navigateur (comme si l'utilisateur avait appuyé sur Shift+Ctrl+R).</dd>
-  <dt><code>userAgent</code>{{optional_inline}}</dt>
-  <dd><code>string</code>. Définissez un agent utilisateur personnalisé pour la page. Ici, la chaîne fournie sera envoyée dans l'en-tête de l'<a href="/fr/docs/Web/HTTP/Headers/User-Agent">Agent utilisateur</a>, et sera renvoyée par les appels à <code><a href="/fr/docs/Web/API/NavigatorID/userAgent">navigator.userAgent</a></code> réalisé par des scripts s'exécutant sur la page.</dd>
-  <dt><code>injectedScript</code> {{optional_inline}}</dt>
-  <dd><code>string</code>. Injectez l'expression JavaScript donnée dans toutes les images de la page, avant tout autre script.</dd>
- </dl>
- </dd>
-</dl>
+- `reloadOptions`{{optional_inline}}
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+  - : `object`. Options pour la fonction, comme suit
 
-<p>{{Compat("webextensions.api.devtools.inspectedWindow.reload")}}</p>
+    - `ignoreCache`{{optional_inline}}
+      - : `boolean`. S'il est vrai, cela fait que le rechargement ignore le cache du navigateur (comme si l'utilisateur avait appuyé sur Shift+Ctrl+R).
+    - `userAgent`{{optional_inline}}
+      - : `string`. Définissez un agent utilisateur personnalisé pour la page. Ici, la chaîne fournie sera envoyée dans l'en-tête de l'[Agent utilisateur](/fr/docs/Web/HTTP/Headers/User-Agent), et sera renvoyée par les appels à [`navigator.userAgent`](/fr/docs/Web/API/NavigatorID/userAgent) réalisé par des scripts s'exécutant sur la page.
+    - `injectedScript` {{optional_inline}}
+      - : `string`. Injectez l'expression JavaScript donnée dans toutes les images de la page, avant tout autre script.
 
-<h2 id="Exemples">Exemples</h2>
+## Compatibilité du navigateur
 
-<p>Rechargez la fenêtre inspectée, définissez l'agent utilisateur et injectez un script</p>
+{{Compat("webextensions.api.devtools.inspectedWindow.reload")}}
 
-<pre class="brush: js">const reloadButton = document.querySelector("#reload-button");
+## Exemples
 
-reloadButton.addEventListener("click", () =&gt; {
+Rechargez la fenêtre inspectée, définissez l'agent utilisateur et injectez un script
+
+```js
+const reloadButton = document.querySelector("#reload-button");
+
+reloadButton.addEventListener("click", () => {
   browser.devtools.inspectedWindow.reload({
     injectedScript:"alert(navigator.userAgent);",
     userAgent: "Not a real UA"
   });
 });
-</pre>
-
-<p>{{WebExtExamples}}</p>
-
-<div class="note"><p><strong>Note :</strong></p>
+```
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools"><code>chrome.devtools</code></a>.</p>
+{{WebExtExamples}}
 
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools`](https://developer.chrome.com/extensions/devtools).
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.
 
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -94,5 +91,4 @@ reloadButton.addEventListener("click", () =&gt; {
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.md
index 74bd42ba3b..5e86e96419 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.md
@@ -12,24 +12,27 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/tabId
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/tabId
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>L'ID de {{WebExtAPIRef("tabs.Tab", "tab")}} est que cette instance des devtools est jointe, représenté comme un nombre.</p>
+L'ID de {{WebExtAPIRef("tabs.Tab", "tab")}} est que cette instance des devtools est jointe, représenté comme un nombre.
 
-<p>Cela peut être envoyé à la page de fond de l'extension, de sorte que la page d'arrière plan peut utiliser l'API {{WebExtAPIRef("tabs")}} pour interargir avec l'onglet :</p>
+Cela peut être envoyé à la page de fond de l'extension, de sorte que la page d'arrière plan peut utiliser l'API {{WebExtAPIRef("tabs")}} pour interargir avec l'onglet :
 
-<pre class="brush: js">// devtools-panel.js
+```js
+// devtools-panel.js
 
 const scriptToAttach = "document.body.innerHTML = 'Hi from the devtools';";
 
-attachContentScriptButton.addEventListener("click", () =&gt; {
+attachContentScriptButton.addEventListener("click", () => {
   browser.runtime.sendMessage({
     tabId: browser.devtools.inspectedWindow.tabId,
     script: scriptToAttach
   });
-});</pre>
+});
+```
 
-<pre class="brush: js">// background.js
+```js
+// background.js
 
 function handleMessage(request, sender, sendResponse) {
   browser.tabs.executeScript(request.tabId, {
@@ -37,23 +40,22 @@ function handleMessage(request, sender, sendResponse) {
   });
 }
 
-browser.runtime.onMessage.addListener(handleMessage);</pre>
+browser.runtime.onMessage.addListener(handleMessage);
+```
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.inspectedWindow.tabId")}}</p>
+{{Compat("webextensions.api.devtools.inspectedWindow.tabId")}}
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools`](https://developer.chrome.com/extensions/devtools).
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools"><code>chrome.devtools</code></a>.</p>
-
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -80,5 +82,4 @@ browser.runtime.onMessage.addListener(handleMessage);</pre>
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.md
index 622856787a..467aa7612d 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.md
@@ -10,34 +10,36 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network/getHAR
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/getHAR
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Obtenez un <a href="http://www.softwareishard.com/blog/har-12-spec/#log">journal HAR</a> pour la page chargée dans l'onglet en cours.</p>
+Obtenez un [journal HAR](http://www.softwareishard.com/blog/har-12-spec/#log) pour la page chargée dans l'onglet en cours.
 
-<p>C'est une fonction asynchrone qui renvoie une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code>.</p>
+C'est une fonction asynchrone qui renvoie une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise).
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">var getting = browser.devtools.network.getHAR()
-</pre>
+```js
+var getting = browser.devtools.network.getHAR()
+```
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<p>None.</p>
+None.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui sera remplie avec un objet contenant le journal HAR pour l'onglet en cours. Pour plus de détails sur ce que contient l'objet journal, reportez-vous à la <a href="http://www.softwareishard.com/blog/har-12-spec/#log">spécification HAR</a>.</p>
+Une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui sera remplie avec un objet contenant le journal HAR pour l'onglet en cours. Pour plus de détails sur ce que contient l'objet journal, reportez-vous à la [spécification HAR](http://www.softwareishard.com/blog/har-12-spec/#log).
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.network.getHAR")}}</p>
+{{Compat("webextensions.api.devtools.network.getHAR")}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Consignez les URL des demandes contenues dans le journal HAR :</p>
+Consignez les URL des demandes contenues dans le journal HAR :
 
-<pre class="brush: js">async function logRequests() {
+```js
+async function logRequests() {
   let harLog = await browser.devtools.network.getHAR();
   console.log(`HAR version: ${harLog.version}`);
   for (let entry of harLog.entries) {
@@ -46,17 +48,15 @@ original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/getHAR
 }
 
 logRequestsButton.addEventListener("click", logRequests);
-</pre>
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.network`](https://developer.chrome.com/extensions/devtools_network).
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_network"><code>chrome.devtools.network</code></a>.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -83,5 +83,4 @@ logRequestsButton.addEventListener("click", logRequests);
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.md
index 77b3bfa8a7..03e7356a3a 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.md
@@ -11,41 +11,35 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network
 ---
-<div>{{AddonSidebar}}</div>
+{{AddonSidebar}}
 
-<p>L'API <code>devtools.network</code> permet à une extension devtools d'obtenir des informations sur les demandes de réseau associées à la fenêtre à laquelle les devtools sont attachés (la fenêtre inspectée).</p>
+L'API `devtools.network` permet à une extension devtools d'obtenir des informations sur les demandes de réseau associées à la fenêtre à laquelle les devtools sont attachés (la fenêtre inspectée).
 
-<p>Comme toutes les APIs de devtools, cette API est uniquement disponible pour le code exécuté dans le document défini dans la clé <a href="/fr/Add-ons/WebExtensions/manifest.json/devtools_page">devtools_page</a> du manifest.json, ou dans d'autres documents de devtools créés par l'extension (tel que le document du panneau). Voir <a href="/fr/Add-ons/WebExtensions/Extending_the_developer_tools">Extension des outils de développement</a> pour plus d'informations.</p>
+Comme toutes les APIs de devtools, cette API est uniquement disponible pour le code exécuté dans le document défini dans la clé [devtools_page](/fr/Add-ons/WebExtensions/manifest.json/devtools_page) du manifest.json, ou dans d'autres documents de devtools créés par l'extension (tel que le document du panneau). Voir [Extension des outils de développement](/fr/Add-ons/WebExtensions/Extending_the_developer_tools) pour plus d'informations.
 
-<h2 id="Fonctions">Fonctions</h2>
+## Fonctions
 
-<dl>
- <dt><a href="/fr/docs/Mozilla/Add-ons/WebExtensions/API/devtools.network/getHAR">devtools.network.getHAR()</a></dt>
- <dd>Obtenez le  <a href="http://www.softwareishard.com/blog/har-12-spec/#log" rel="noopener">journal HAR</a> pour la page chargée dans l'onglet en cours..</dd>
-</dl>
+- [devtools.network.getHAR()](/fr/docs/Mozilla/Add-ons/WebExtensions/API/devtools.network/getHAR)
+  - : Obtenez le  [journal HAR](http://www.softwareishard.com/blog/har-12-spec/#log) pour la page chargée dans l'onglet en cours..
 
-<h2 id="Evénements">Evénements</h2>
+## Evénements
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.network/onNavigated">devtools.network.onNavigated</a></code></dt>
- <dd>Attiré lorsque l'utilisateur navigue dans la fenêtre inspectée vers une nouvelle page.</dd>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.network/onRequestFinished">devtools.network.onRequestFinished</a></code></dt>
- <dd>Lancé lorsque la demande réseau est terminée et que ses détails sont disponibles pour l'extension.</dd>
-</dl>
+- [`devtools.network.onNavigated`](/fr/Add-ons/WebExtensions/API/devtools.network/onNavigated)
+  - : Attiré lorsque l'utilisateur navigue dans la fenêtre inspectée vers une nouvelle page.
+- [`devtools.network.onRequestFinished`](/fr/Add-ons/WebExtensions/API/devtools.network/onRequestFinished)
+  - : Lancé lorsque la demande réseau est terminée et que ses détails sont disponibles pour l'extension.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.network")}}</p>
+{{Compat("webextensions.api.devtools.network")}}
 
-<p>{{WebExtExamples("h2")}}</p>
+{{WebExtExamples("h2")}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.network`](https://developer.chrome.com/extensions/devtools_network).
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_network"><code>chrome.devtools.network</code></a>.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -72,5 +66,4 @@ original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.md
index bc75f0ecdd..eed26e56a7 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.md
@@ -11,67 +11,61 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network/onNavigated
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/onNavigated
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Mise en place lorsque l'utilisateur navigue dans la fenêtre inspectée vers une nouvelle page</p>
+Mise en place lorsque l'utilisateur navigue dans la fenêtre inspectée vers une nouvelle page
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">browser.devtools.network.onNavigated.addListener(listener)
+```js
+browser.devtools.network.onNavigated.addListener(listener)
 browser.devtools.network.onNavigated.removeListener(listener)
 browser.devtools.network.onNavigated.hasListener(listener)
-</pre>
+```
 
-<p>Les événements ont trois fonctions :</p>
+Les événements ont trois fonctions :
 
-<dl>
- <dt><code>addListener(listener)</code></dt>
- <dd>Ajouter un auditeur à cet événement.</dd>
- <dt><code>removeListener(listener)</code></dt>
- <dd>Arrêter d'écouter un événement. L'argument de l'auditeur est l'auditeur à supprimer.</dd>
- <dt><code>hasListener(listener)</code></dt>
- <dd>Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie <strong>vrai</strong> si elle écoute, sinon <strong>faux</strong>.</dd>
-</dl>
+- `addListener(listener)`
+  - : Ajouter un auditeur à cet événement.
+- `removeListener(listener)`
+  - : Arrêter d'écouter un événement. L'argument de l'auditeur est l'auditeur à supprimer.
+- `hasListener(listener)`
+  - : Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie **vrai** si elle écoute, sinon **faux**.
 
-<h2 id="Syntaxe_addListener">Syntaxe addListener</h2>
+## Syntaxe addListener
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>callback</code></dt>
- <dd>
- <p>Fonction qui sera appelée lors de l'événement. La fonction passera les arguments suivants :</p>
+- `callback`
 
- <dl>
-  <dt><code>url</code></dt>
-  <dd><code>string</code>. La nouvelle URL pour la fenêtre.</dd>
- </dl>
- </dd>
-</dl>
+  - : Fonction qui sera appelée lors de l'événement. La fonction passera les arguments suivants :
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+    - `url`
+      - : `string`. La nouvelle URL pour la fenêtre.
 
-<p>{{Compat("webextensions.api.devtools.network.onNavigated")}}</p>
+## Compatibilité du navigateur
 
-<h2 id="Exemples">Exemples</h2>
+{{Compat("webextensions.api.devtools.network.onNavigated")}}
 
-<pre class="brush: js">function handleNavigated(url) {
+## Exemples
+
+```js
+function handleNavigated(url) {
   console.log(url);
 }
 
-browser.devtools.network.onNavigated.addListener(handleNavigated);</pre>
-
-<p>{{WebExtExamples}}</p>
-
-<div class="note"><p><strong>Note :</strong></p>
+browser.devtools.network.onNavigated.addListener(handleNavigated);
+```
 
-<p>Cette API est basée sur l'API <a href="https://developer.chrome.com/extensions/devtools"><code>chrome.devtools</code></a> de Chromium.</p>
+{{WebExtExamples}}
 
-<p>Les données de compatibilité de  Microsoft Edge sont fournies par Microsoft Corporation et sont incluses ici sous la licence Creative Commons Attribution 3.0 United States.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API [`chrome.devtools`](https://developer.chrome.com/extensions/devtools) de Chromium.
+>
+> Les données de compatibilité de  Microsoft Edge sont fournies par Microsoft Corporation et sont incluses ici sous la licence Creative Commons Attribution 3.0 United States.
 
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -98,5 +92,4 @@ browser.devtools.network.onNavigated.addListener(handleNavigated);</pre>
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.md
index 10f287569b..badfae44b0 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.md
@@ -13,74 +13,68 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network/onRequestFinished
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/onRequestFinished
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Lancé lorsqu'une requête réseau est terminée et que ses détails sont disponibles pour l'extension.</p>
+Lancé lorsqu'une requête réseau est terminée et que ses détails sont disponibles pour l'extension.
 
-<p>La requête est donnée en tant qu'<a href="http://www.softwareishard.com/blog/har-12-spec/#entries">objet d'entrée HAR</a>, qui est également doté d'une méthode <code>getContent()</code> asynchrone qui récupère le contenu du corps de la réponse.</p>
+La requête est donnée en tant qu'[objet d'entrée HAR](http://www.softwareishard.com/blog/har-12-spec/#entries), qui est également doté d'une méthode `getContent()` asynchrone qui récupère le contenu du corps de la réponse.
 
-<p>Notez que bien que votre extension puisse ajouter un écouteur à tout moment,elle commencera seulement à se déclencher après que l'utilisateur a activé le <a href="/fr/docs/Outils/Moniteur_réseau">moniteur réseau</a> du navigateur au moins une fois.</p>
+Notez que bien que votre extension puisse ajouter un écouteur à tout moment,elle commencera seulement à se déclencher après que l'utilisateur a activé le [moniteur réseau](/fr/docs/Outils/Moniteur_réseau) du navigateur au moins une fois.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">browser.devtools.network.onRequestFinished.addListener(listener)
+```js
+browser.devtools.network.onRequestFinished.addListener(listener)
 browser.devtools.network.onRequestFinished.removeListener(listener)
 browser.devtools.network.onRequestFinished.hasListener(listener)
-</pre>
+```
 
-<p>Les événements ont trois fonctions</p>
+Les événements ont trois fonctions
 
-<dl>
- <dt><code>addListener(listener)</code></dt>
- <dd>Ajoute un écouteur à cet événement.</dd>
- <dt><code>removeListener(listener)</code></dt>
- <dd>Arrêtez d'écouter cet événement. L'argument de <code>listener</code>  est l'écouteur à supprimer.</dd>
- <dt><code>hasListener(listener)</code></dt>
- <dd>Vérifiez si <code>listener</code> est enregistré pour cet événement. Renvoie <code>true</code>s'il écoute, sinon <code>false</code>.</dd>
-</dl>
+- `addListener(listener)`
+  - : Ajoute un écouteur à cet événement.
+- `removeListener(listener)`
+  - : Arrêtez d'écouter cet événement. L'argument de `listener`  est l'écouteur à supprimer.
+- `hasListener(listener)`
+  - : Vérifiez si `listener` est enregistré pour cet événement. Renvoie `true`s'il écoute, sinon `false`.
 
-<h2 id="Syntaxe_addListener">Syntaxe addListener</h2>
+## Syntaxe addListener
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>callback</code></dt>
- <dd>
- <p>Fonction qui sera appelée lorsque cet événement se produit. La fonction recevra les arguments suivants :</p>
+- `callback`
 
- <dl>
-  <dt><code>request</code></dt>
-  <dd><code>object</code>. Un objet représentant la requête. Cet objet est un seul objet d'<a href="http://www.softwareishard.com/blog/har-12-spec/#entries">entrée HAR</a>. Il définit également une méthode <code>getContent()</code> asynchrone, qui renvoie une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui se résout avec le corps de la réponse.</dd>
- </dl>
- </dd>
-</dl>
+  - : Fonction qui sera appelée lorsque cet événement se produit. La fonction recevra les arguments suivants :
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+    - `request`
+      - : `object`. Un objet représentant la requête. Cet objet est un seul objet d'[entrée HAR](http://www.softwareishard.com/blog/har-12-spec/#entries). Il définit également une méthode `getContent()` asynchrone, qui renvoie une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui se résout avec le corps de la réponse.
 
-<p>{{Compat("webextensions.api.devtools.network.onRequestFinished")}}</p>
+## Compatibilité du navigateur
 
-<h2 id="Examples">Examples</h2>
+{{Compat("webextensions.api.devtools.network.onRequestFinished")}}
 
-<p>Ajoutez un écouteur qui consigne l'adresse IP du serveur et le corps de la réponse pour chaque requête réseau.</p>
+## Examples
 
-<pre class="brush: js">function handleRequestFinished(request) {
+Ajoutez un écouteur qui consigne l'adresse IP du serveur et le corps de la réponse pour chaque requête réseau.
+
+```js
+function handleRequestFinished(request) {
   console.log("Server IP: ", request.serverIPAddress);
-  request.getContent().then(content =&gt; {
+  request.getContent().then(content => {
     console.log("Content: ", content);
   });
 }
 
-browser.devtools.network.onRequestFinished.addListener(handleRequestFinished);</pre>
-
-<p>{{WebExtExamples}}</p>
+browser.devtools.network.onRequestFinished.addListener(handleRequestFinished);
+```
 
-<div class="note"><p><strong>Note :</strong></p>
+{{WebExtExamples}}
 
-<p>Cette API est basée sur l'API <a href="https://developer.chrome.com/extensions/devtools"><code>chrome.devtools</code></a> de Chromium.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API [`chrome.devtools`](https://developer.chrome.com/extensions/devtools) de Chromium.
 
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -107,5 +101,4 @@ browser.devtools.network.onRequestFinished.addListener(handleRequestFinished);</
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.md
index 4ea3a37efb..0aef6cc3fa 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.md
@@ -12,45 +12,45 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/create
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/create
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Ajoute un nouveau panneau aux devtools.</p>
+Ajoute un nouveau panneau aux devtools.
 
-<p>Cette fonction prend : un titre, une URL vers un fichier d'icône et une URL vers un fichier HTML. Il crée un nouveau panneau dans les devtools, dont le contenu est spécifié par le fichier HTML. Il renvoie une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui résout un objet <code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel">ExtensionPanel</a></code> représentant le nouveau panneau.</p>
+Cette fonction prend : un titre, une URL vers un fichier d'icône et une URL vers un fichier HTML. Il crée un nouveau panneau dans les devtools, dont le contenu est spécifié par le fichier HTML. Il renvoie une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui résout un objet [`ExtensionPanel`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel) représentant le nouveau panneau.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">var creating = browser.devtools.panels.create(
+```js
+var creating = browser.devtools.panels.create(
   title,       // string
   iconPath,    // string
   pagePath     // string
 )
-</pre>
+```
 
-<h3 id="Parametères">Parametères</h3>
+### Parametères
 
-<dl>
- <dt><code>title</code></dt>
- <dd><code>string</code>. Le titre du panneau. Cela apparaitra dans la rangée des onglets le long du haut de la fenêtre des devtools, et c'est la principale façon dont l'utilisateur pourra identifier votre panneau.</dd>
- <dt><code>iconPath</code></dt>
- <dd><code>string</code>. Spécifie une icône qui sera affichée à côté du titre. Il est fourni sous forme d'URL vers un fichier image qui a été fourni avec votre extension. L'URL est résolue par rapport à la page d'extension courante (sauf si elle est exprimée en url absolue, par exemple "/icons/panel.png").</dd>
- <dt><code>pagePath</code></dt>
- <dd>string. Spécifie un fichier HTML qui définit le contenu réel du panneau. Il est fourni sous la forme d'une URL d'un fichier HTML qui a été regroupé avec votre extension. L'URL est résolue par rapport à la page d'extension courante (sauf si elle est exprimée en url absolue, par exemple "/devtools/panel.html"). Le fichier HTML peut include des fichiers CSS et JavaScript, juste comme une page web normale. Le JavaScript en cours d'éxécution dans le panneau pourra utiliser les API devtools. Voir <a href="/fr/docs/Mozilla/Add-ons/WebExtensions/Extending_the_developer_tools">Extention des outils de développement</a>.</dd>
-</dl>
+- `title`
+  - : `string`. Le titre du panneau. Cela apparaitra dans la rangée des onglets le long du haut de la fenêtre des devtools, et c'est la principale façon dont l'utilisateur pourra identifier votre panneau.
+- `iconPath`
+  - : `string`. Spécifie une icône qui sera affichée à côté du titre. Il est fourni sous forme d'URL vers un fichier image qui a été fourni avec votre extension. L'URL est résolue par rapport à la page d'extension courante (sauf si elle est exprimée en url absolue, par exemple "/icons/panel.png").
+- `pagePath`
+  - : string. Spécifie un fichier HTML qui définit le contenu réel du panneau. Il est fourni sous la forme d'une URL d'un fichier HTML qui a été regroupé avec votre extension. L'URL est résolue par rapport à la page d'extension courante (sauf si elle est exprimée en url absolue, par exemple "/devtools/panel.html"). Le fichier HTML peut include des fichiers CSS et JavaScript, juste comme une page web normale. Le JavaScript en cours d'éxécution dans le panneau pourra utiliser les API devtools. Voir [Extention des outils de développement](/fr/docs/Mozilla/Add-ons/WebExtensions/Extending_the_developer_tools).
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui sera remplie avec un objet <code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel">ExtensionPanel</a></code> représentant le nouveau panneau.</p>
+Une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui sera remplie avec un objet [`ExtensionPanel`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel) représentant le nouveau panneau.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.create")}}</p>
+{{Compat("webextensions.api.devtools.panels.create")}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Créer un nouveau panneau, et ajoute des auditeurs à ces événements onShown et  onHidden :</p>
+Créer un nouveau panneau, et ajoute des auditeurs à ces événements onShown et  onHidden :
 
-<pre class="brush: js">function handleShown() {
+```js
+function handleShown() {
   console.log("panel is being shown");
 }
 
@@ -62,23 +62,21 @@ browser.devtools.panels.create(
   "My Panel",                 // title
   "/icons/star.png",           // icon
   "/devtools/panel/panel.html" // content
-).then((newPanel) =&gt; {
+).then((newPanel) => {
   newPanel.onShown.addListener(handleShown);
   newPanel.onHidden.addListener(handleHidden);
 });
-</pre>
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -105,5 +103,4 @@ browser.devtools.panels.create(
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.md
index 13429a0e32..2aa676946f 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.md
@@ -12,17 +12,16 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/elements
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/elements
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Un objet <code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel">ElementsPanel</a></code> qui représente l'inspecteur HTML/CSS du navigateur</p>
+Un objet [`ElementsPanel`](/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel) qui représente l'inspecteur HTML/CSS du navigateur
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.elements", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.elements", 10)}}
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
-
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.md
index 5725db54ca..33a0c691e0 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.md
@@ -16,45 +16,45 @@ translation_of: >-
 original_slug: >-
   Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/createSidebarPane
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Ajoute un nouveau volet à la barre latérale dans l'inspecteur HTML / CSS.</p>
+Ajoute un nouveau volet à la barre latérale dans l'inspecteur HTML / CSS.
 
-<p>L'inspecteur HTML / CSS, appelé l'<a href="/fr/docs/Outils/Inspecteur">inspecteur de page</a> dans Firefox et le <a href="https://developers.google.com/web/tools/chrome-devtools/inspect-styles/">panneau éléments</a> dans Chrome, affiche la page DOM dans la partie principale de sa fenêtre et possède une barre latérale qui affiche divers autres aspects de la page HTML / CSS dans une interface à onglets. Par exemple, dans Firefox, la barre latérale peut afficher les règles CSS pour l'élément sélectionné, ou ses polices, ou son modèle de boîte.</p>
+L'inspecteur HTML / CSS, appelé l'[inspecteur de page](/fr/docs/Outils/Inspecteur) dans Firefox et le [panneau éléments](https://developers.google.com/web/tools/chrome-devtools/inspect-styles/) dans Chrome, affiche la page DOM dans la partie principale de sa fenêtre et possède une barre latérale qui affiche divers autres aspects de la page HTML / CSS dans une interface à onglets. Par exemple, dans Firefox, la barre latérale peut afficher les règles CSS pour l'élément sélectionné, ou ses polices, ou son modèle de boîte.
 
-<p>La fonction <code>createSidebarPane()</code> ajoute un nouveau volet à la barre latérale. ar exemple, la capture d'écran ci-dessous montre un nouveau volet intitulé "My pane", qui affiche un objet JSON :</p>
+La fonction `createSidebarPane()` ajoute un nouveau volet à la barre latérale. ar exemple, la capture d'écran ci-dessous montre un nouveau volet intitulé "My pane", qui affiche un objet JSON :
 
-<p><img alt="" src="inspector-sidebar.png"></p>
+![](inspector-sidebar.png)
 
-<p>Cette fonction prend un argument, qui est une chaîne représentant le titre du volet. Il renvoie une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui se résout en un objet <code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane">ExtensionSidebarPane</a></code> représentant le nouveau volet. Vous pouvez utiliser cet objet pour définir le contenu et le comportement du volet.</p>
+Cette fonction prend un argument, qui est une chaîne représentant le titre du volet. Il renvoie une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui se résout en un objet [`ExtensionSidebarPane`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane) représentant le nouveau volet. Vous pouvez utiliser cet objet pour définir le contenu et le comportement du volet.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">var creating = browser.devtools.panels.elements.createSidebarPane(
+```js
+var creating = browser.devtools.panels.elements.createSidebarPane(
   title       // string
 )
-</pre>
+```
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>title</code></dt>
- <dd><code>string</code>. Cela apparaîtra dans la rangée d'onglets en haut de la barre latérale, et c'est la principale façon pour l'utilisateur d'identifier votre panneau.</dd>
-</dl>
+- `title`
+  - : `string`. Cela apparaîtra dans la rangée d'onglets en haut de la barre latérale, et c'est la principale façon pour l'utilisateur d'identifier votre panneau.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui sera remplie avec un objet <code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane">ExtensionSidebarPane</a></code> représentant le nouveau volet.</p>
+Une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui sera remplie avec un objet [`ExtensionSidebarPane`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane) représentant le nouveau volet.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ElementsPanel.createSidebarPane", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.ElementsPanel.createSidebarPane", 10)}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Créez un nouveau volet et remplissez-le avec un objet JSON. Vous pouvez exécuter ce code dans un script chargé par la <a href="/fr/Add-ons/WebExtensions/manifest.json/devtools_page">page devtools</a>.</p>
+Créez un nouveau volet et remplissez-le avec un objet JSON. Vous pouvez exécuter ce code dans un script chargé par la [page devtools](/fr/Add-ons/WebExtensions/manifest.json/devtools_page).
 
-<pre class="brush: js">function onCreated(sidebarPane) {
+```js
+function onCreated(sidebarPane) {
   sidebarPane.setObject({
     someBool: true,
     someString: "hello there",
@@ -66,17 +66,15 @@ original_slug: >-
 }
 
 browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
-</pre>
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -103,5 +101,4 @@ browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.md
index cb9b7b24be..f1a8550e2b 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.md
@@ -13,37 +13,31 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Un <code>ElementsPanel</code> représente l'inspecteur HTML/CSS dans la devtools du navigateur. C'est ce qu'on appelle l'inspecteur de page dans Firefox et le panneau Éléments de Chrome.</p>
+Un `ElementsPanel` représente l'inspecteur HTML/CSS dans la devtools du navigateur. C'est ce qu'on appelle l'inspecteur de page dans Firefox et le panneau Éléments de Chrome.
 
-<h2 id="Fonctions">Fonctions</h2>
+## Fonctions
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/createSidebarPane">devtools.panels.ElementsPanel.createSidebarPane()</a></code></dt>
- <dd>Crée un volet dans la barre latérale de l'inspecteur.</dd>
-</dl>
+- [`devtools.panels.ElementsPanel.createSidebarPane()`](/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/createSidebarPane)
+  - : Crée un volet dans la barre latérale de l'inspecteur.
 
-<h2 id="Evénements">Evénements</h2>
+## Evénements
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/onSelectionChanged">devtools.panels.ElementsPanel.onSelectionChanged</a></code></dt>
- <dd>Appèle lorsque l'utilisateur sélectionne un élément différent dans la page, par exemple en utilisant l'élément de menu contextuel "inspect élément".</dd>
-</dl>
+- [`devtools.panels.ElementsPanel.onSelectionChanged`](/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/onSelectionChanged)
+  - : Appèle lorsque l'utilisateur sélectionne un élément différent dans la page, par exemple en utilisant l'élément de menu contextuel "inspect élément".
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ElementsPanel", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.ElementsPanel", 10)}}
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -70,5 +64,4 @@ original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.md
index d04a11bf65..facca729d4 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.md
@@ -16,59 +16,55 @@ translation_of: >-
 original_slug: >-
   Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/onSelectionChanged
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Appelles lorsque l'utilisateur sélectionne un élément de page différent pour l'inspection avec les outils de développement du navigateur, par exemple en sélectionnant l'élément de menu contextuel "Inspect Element" dans Firefox.</p>
+Appelles lorsque l'utilisateur sélectionne un élément de page différent pour l'inspection avec les outils de développement du navigateur, par exemple en sélectionnant l'élément de menu contextuel "Inspect Element" dans Firefox.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">browser.devtools.panels.elements.onSelectionChanged.addListener(listener)
+```js
+browser.devtools.panels.elements.onSelectionChanged.addListener(listener)
 browser.devtools.panels.elements.onSelectionChanged.removeListener(listener)
 browser.devtools.panels.elements.onSelectionChanged.hasListener(listener)
-</pre>
+```
 
-<p>L'événement a trois fonctions :</p>
+L'événement a trois fonctions :
 
-<dl>
- <dt><code>addListener(listener)</code></dt>
- <dd>Ajoute une écoute à cet événement.</dd>
- <dt><code>removeListener(listener)</code></dt>
- <dd>Arrête une écoute à l'événement. L'argument de l'auditeur est un auditeur supprimer.</dd>
- <dt><code>hasListener(listener)</code></dt>
- <dd>Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie la valeur Vrai si elle l'écoute, sinon Faux.</dd>
-</dl>
+- `addListener(listener)`
+  - : Ajoute une écoute à cet événement.
+- `removeListener(listener)`
+  - : Arrête une écoute à l'événement. L'argument de l'auditeur est un auditeur supprimer.
+- `hasListener(listener)`
+  - : Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie la valeur Vrai si elle l'écoute, sinon Faux.
 
-<h2 id="Syntaxe_addListener">Syntaxe addListener</h2>
+## Syntaxe addListener
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>callback</code></dt>
- <dd>
- <p>Fonction qui sera appelée lors de l'événement. La fonction ne passera pas d'arguments.</p>
- </dd>
-</dl>
+- `callback`
+  - : Fonction qui sera appelée lors de l'événement. La fonction ne passera pas d'arguments.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ElementsPanel.onSelectionChanged", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.ElementsPanel.onSelectionChanged", 10)}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Ecoutez la sélection des événements modifiés, et enregistrez le contenu du texte de l'élément nouvellement sélectionné :</p>
+Ecoutez la sélection des événements modifiés, et enregistrez le contenu du texte de l'élément nouvellement sélectionné :
 
-<pre class="brush: js">function handleSelectedElement() {
+```js
+function handleSelectedElement() {
   browser.devtools.inspectedWindow.eval("$0.textContent")
-    .then((result) =&gt; {
+    .then((result) => {
       console.log(result[0]);
     });
 }
 
-browser.devtools.panels.elements.onSelectionChanged.addListener(handleSelectedElement);</pre>
+browser.devtools.panels.elements.onSelectionChanged.addListener(handleSelectedElement);
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
-
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools"><code>chrome.devtools</code></a>.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools`](https://developer.chrome.com/extensions/devtools).
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.md
index 8dc65df859..da15469158 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.md
@@ -11,28 +11,27 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Une <code>ExtensionPanel</code> représente un panneau ajouté aux devtools. C'est la résolution de la <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> renvoyé par <code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/create">browser.devtools.panels.create()</a></code>.</p>
+Une `ExtensionPanel` représente un panneau ajouté aux devtools. C'est la résolution de la [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) renvoyé par [`browser.devtools.panels.create()`](/fr/Add-ons/WebExtensions/API/devtools.panels/create).
 
-<h2 id="Type">Type</h2>
+## Type
 
-<p>Les valeurs de ce type sont des objets. Définissez deux événements, <code>onShown</code> et <code>onHidden</code>.</p>
+Les valeurs de ce type sont des objets. Définissez deux événements, `onShown` et `onHidden`.
 
-<ul>
- <li><code>onShown</code> est émis lorsque le panneau est affiché dans les devtools (par exemple, quand l'utilisateur a cliqué sur le panneau dans la fenêtre des  devtools).</li>
- <li><code>onHidden</code> est émis lorsque le panneau est caché (par exemple, quand l'utilisateur a basculé sur un onglet différent dans la fenêtre devtools).</li>
-</ul>
+- `onShown` est émis lorsque le panneau est affiché dans les devtools (par exemple, quand l'utilisateur a cliqué sur le panneau dans la fenêtre des  devtools).
+- `onHidden` est émis lorsque le panneau est caché (par exemple, quand l'utilisateur a basculé sur un onglet différent dans la fenêtre devtools).
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ExtensionPanel")}}</p>
+{{Compat("webextensions.api.devtools.panels.ExtensionPanel")}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Ce code crée un nouveau panneau, puis ajoute des gestionnaires pour ces événements <code>onShown</code> et <code>onHidden</code>.</p>
+Ce code crée un nouveau panneau, puis ajoute des gestionnaires pour ces événements `onShown` et `onHidden`.
 
-<pre class="brush: js">function handleShown(e) {
+```js
+function handleShown(e) {
   console.log(e);
   console.log("panel is being shown");
 }
@@ -46,22 +45,21 @@ browser.devtools.panels.create(
   "My Panel",                 // title
   "icons/star.png",           // icon
   "devtools/panel/panel.html" // content
-).then((newPanel) =&gt; {
+).then((newPanel) => {
   newPanel.onShown.addListener(handleShown);
   newPanel.onHidden.addListener(handleHidden);
-});</pre>
+});
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -88,5 +86,4 @@ browser.devtools.panels.create(
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.md
index d56f4b58fc..8ce0d0abfb 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.md
@@ -13,53 +13,41 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane
 ---
-<div>{{AddonSidebar}}</div>
+{{AddonSidebar}}
 
-<p>L'objet <code>ExtensionSidebarPane</code> représente un volet qu'une extension a ajouté à la barre latérale dans l'inspecteur HTML/CSS du navigateur.</p>
+L'objet `ExtensionSidebarPane` représente un volet qu'une extension a ajouté à la barre latérale dans l'inspecteur HTML/CSS du navigateur.
 
-<p><img alt="" src="inspector-sidebar.png"></p>
+![](inspector-sidebar.png)
 
-<p>Pour créer un <code>ExtensionSidebarPane</code>, appelez la fonction <code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/createSidebarPane">browser.devtools.panels.elements.createSidebarane()</a></code>.</p>
+Pour créer un `ExtensionSidebarPane`, appelez la fonction [`browser.devtools.panels.elements.createSidebarane()`](/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/createSidebarPane).
 
-<h2 id="Fonctions">Fonctions</h2>
+## Fonctions
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setExpression">devtools.panels.ExtensionSidebarPane.setExpression()</a></code></dt>
- <dd>
- <p>Évaluer une expression JavaScript dans la page Web inspectée par l'inspecteur. Le résultat est affiché dans le volet de la barre latérale.</p>
- </dd>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setObject">devtools.panels.ExtensionSidebarPane.setObject()</a></code></dt>
- <dd>
- <p>Définit un objet JSON qui sera affiché dans le volet de la barre latérale.</p>
- </dd>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setPage">devtools.panels.ExtensionSidebarPane.setPage()</a></code></dt>
- <dd>
- <p>Charge la page pointée par l'URL fournie.</p>
- </dd>
-</dl>
+- [`devtools.panels.ExtensionSidebarPane.setExpression()`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setExpression)
+  - : Évaluer une expression JavaScript dans la page Web inspectée par l'inspecteur. Le résultat est affiché dans le volet de la barre latérale.
+- [`devtools.panels.ExtensionSidebarPane.setObject()`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setObject)
+  - : Définit un objet JSON qui sera affiché dans le volet de la barre latérale.
+- [`devtools.panels.ExtensionSidebarPane.setPage()`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setPage)
+  - : Charge la page pointée par l'URL fournie.
 
-<h2 id="Evénements">Evénements</h2>
+## Evénements
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onShown">devtools.panels.ExtensionSidebarPane.onShown</a></code></dt>
- <dd>Lancé lorsque le volet latéral est affiché.</dd>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onHidden">devtools.panels.ExtensionSidebarPane.onHidden</a></code></dt>
- <dd>Lancé lorsque le volet de la barre latérale est masqué.</dd>
-</dl>
+- [`devtools.panels.ExtensionSidebarPane.onShown`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onShown)
+  - : Lancé lorsque le volet latéral est affiché.
+- [`devtools.panels.ExtensionSidebarPane.onHidden`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onHidden)
+  - : Lancé lorsque le volet de la barre latérale est masqué.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane", 10)}}
 
-<p>{{WebExtExamples("h2")}}</p>
+{{WebExtExamples("h2")}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -86,5 +74,4 @@ original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSideba
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.md
index ac7d1e0aaa..07027a36f4 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.md
@@ -16,65 +16,60 @@ translation_of: >-
 original_slug: >-
   Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onHidden
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Appelé lorsque le volet de la barre latérale est masqué, suite à l'abandon de l'utilisateur.</p>
+Appelé lorsque le volet de la barre latérale est masqué, suite à l'abandon de l'utilisateur.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">browser.devtools.panels.onHidden.addListener(listener)
+```js
+browser.devtools.panels.onHidden.addListener(listener)
 browser.devtools.panels.onHidden.removeListener(listener)
 browser.devtools.panels.onHidden.hasListener(listener)
-</pre>
+```
 
-<p>Les événements ont trois fonctions:</p>
+Les événements ont trois fonctions:
 
-<dl>
- <dt><code>addListener(callback)</code></dt>
- <dd>Ajoute un écouteur à cet événement.</dd>
- <dt><code>removeListener(listener)</code></dt>
- <dd>Arrête d'écouter cet événement. L'argument <code>listener</code> est l'écouteur à supprimer.</dd>
- <dt><code>hasListener(listener)</code></dt>
- <dd>Vérifie si <code>listener</code> est enregistré pour cet événement. Renvoie <code>true</code> s'il écoute,  sinon <code>false</code>.</dd>
-</dl>
+- `addListener(callback)`
+  - : Ajoute un écouteur à cet événement.
+- `removeListener(listener)`
+  - : Arrête d'écouter cet événement. L'argument `listener` est l'écouteur à supprimer.
+- `hasListener(listener)`
+  - : Vérifie si `listener` est enregistré pour cet événement. Renvoie `true` s'il écoute,  sinon `false`.
 
-<h2 id="Syntaxe_addListener">Syntaxe addListener</h2>
+## Syntaxe addListener
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>callback</code></dt>
- <dd>
- <p>Fonction appelée lorsque cet événement se produit. Cette fonction sera passée sans arguments.</p>
- </dd>
-</dl>
+- `callback`
+  - : Fonction appelée lorsque cet événement se produit. Cette fonction sera passée sans arguments.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.onHidden", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.onHidden", 10)}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Créez un volet de barre latérale et journal afficher et masquer les événements.</p>
+Créez un volet de barre latérale et journal afficher et masquer les événements.
 
-<pre class="brush: js">function onCreated(sidebarPane) {
+```js
+function onCreated(sidebarPane) {
 
-  sidebarPane.onShown.addListener(() =&gt; {
+  sidebarPane.onShown.addListener(() => {
     console.log("Shown");
   });
 
-  sidebarPane.onHidden.addListener(() =&gt; {
+  sidebarPane.onHidden.addListener(() => {
     console.log("Hidden");
   });
 
 }
 
 browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
-</pre>
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
-
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.md
index e1338a1d19..d04c2e7434 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.md
@@ -13,65 +13,60 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onShown
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onShown
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Lancé lorsque le volet latéral devient visible suite à un changement d'utilisateur.</p>
+Lancé lorsque le volet latéral devient visible suite à un changement d'utilisateur.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">browser.devtools.panels.onShown.addListener(listener)
+```js
+browser.devtools.panels.onShown.addListener(listener)
 browser.devtools.panels.onShown.removeListener(listener)
 browser.devtools.panels.onShown.hasListener(listener)
-</pre>
+```
 
-<p>Les événements ont trois fonctions :</p>
+Les événements ont trois fonctions :
 
-<dl>
- <dt><code>addListener(callback)</code></dt>
- <dd>Ajoute un écouteur à cet événement.</dd>
- <dt><code>removeListener(listener)</code></dt>
- <dd>Arrêtez d'écouter cet événement. L'argument de <code>listener</code> est l'écouteur à supprimer.</dd>
- <dt><code>hasListener(listener)</code></dt>
- <dd>Vérifiez si <code>listener</code> est enregistré pour cet événement. Renvoie <code>true</code> s'il écoute, sinon <code>false</code>.</dd>
-</dl>
+- `addListener(callback)`
+  - : Ajoute un écouteur à cet événement.
+- `removeListener(listener)`
+  - : Arrêtez d'écouter cet événement. L'argument de `listener` est l'écouteur à supprimer.
+- `hasListener(listener)`
+  - : Vérifiez si `listener` est enregistré pour cet événement. Renvoie `true` s'il écoute, sinon `false`.
 
-<h2 id="Syntaxe_addListener">Syntaxe addListener</h2>
+## Syntaxe addListener
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>callback</code></dt>
- <dd>
- <p>Fonction qui sera appelée lorsque cet événement se produit. La fonction sera passée sans arguments.</p>
- </dd>
-</dl>
+- `callback`
+  - : Fonction qui sera appelée lorsque cet événement se produit. La fonction sera passée sans arguments.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.onShown", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.onShown", 10)}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Créez un volet de barre latérale et journal afficher et masquer les événements.</p>
+Créez un volet de barre latérale et journal afficher et masquer les événements.
 
-<pre class="brush: js">function onCreated(sidebarPane) {
+```js
+function onCreated(sidebarPane) {
 
-  sidebarPane.onShown.addListener(() =&gt; {
+  sidebarPane.onShown.addListener(() => {
     console.log("Shown");
   });
 
-  sidebarPane.onHidden.addListener(() =&gt; {
+  sidebarPane.onHidden.addListener(() => {
     console.log("Hidden");
   });
 
 }
 
 browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
-</pre>
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
-
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.md
index 0098ac9f7a..91d228de49 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.md
@@ -15,49 +15,49 @@ translation_of: >-
 original_slug: >-
   Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setExpression
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Evalue une expression dans le contexte de la page inspectée et affiche le résultat dans le volet de la barre latérale d'extension.</p>
+Evalue une expression dans le contexte de la page inspectée et affiche le résultat dans le volet de la barre latérale d'extension.
 
-<p>Le contexte d'exécution de l'expression est le même que celui de <code><a href="/fr/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval">inspectedWindow.eval()</a></code>.</p>
+Le contexte d'exécution de l'expression est le même que celui de [`inspectedWindow.eval()`](/fr/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval).
 
-<p> Les objets JSON et les noeuds DOM sont affichés en tant qu'arborescence extensible, comme dans la <a href="/fr/docs/Outils/JSON_viewer">visionneuse jSON</a> dans Firefox. Vous pouvez éventuellement spécifier une chaîne <code>rootTitle</code> : elle sera affichée comme le titre de la racine de l'arbre.</p>
+Les objets JSON et les noeuds DOM sont affichés en tant qu'arborescence extensible, comme dans la [visionneuse jSON](/fr/docs/Outils/JSON_viewer) dans Firefox. Vous pouvez éventuellement spécifier une chaîne `rootTitle` : elle sera affichée comme le titre de la racine de l'arbre.
 
-<p>C'est une fonction asynchrone qui renvoie une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code>.</p>
+C'est une fonction asynchrone qui renvoie une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise).
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">var evaluating = browser.devtools.panels.setExpression(
+```js
+var evaluating = browser.devtools.panels.setExpression(
   expression,       // string
   rootTitle         // string
 )
-</pre>
+```
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>expression</code></dt>
- <dd><code>string</code>. L'expression à évaluer.</dd>
- <dt><code>rootTitle</code> {{optional_inline}}</dt>
- <dd>string. Le titre de la racine de l'arbre dans lequel les résultats sont affichés.</dd>
-</dl>
+- `expression`
+  - : `string`. L'expression à évaluer.
+- `rootTitle` {{optional_inline}}
+  - : string. Le titre de la racine de l'arbre dans lequel les résultats sont affichés.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> sera remplie sans arguments, une fois l'expression évaluée.</p>
+Une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) sera remplie sans arguments, une fois l'expression évaluée.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setExpression", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setExpression", 10)}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Ce code crée un volet de barre latérale qui affiche le <code><a href="/fr/docs/Web/API/Element/tagName">tagName</a></code> de l'élément actuellement sélectionné :</p>
+Ce code crée un volet de barre latérale qui affiche le [`tagName`](/fr/docs/Web/API/Element/tagName) de l'élément actuellement sélectionné :
 
-<pre class="brush: js">function onCreated(sidebarPane) {
+```js
+function onCreated(sidebarPane) {
 
-  browser.devtools.panels.elements.onSelectionChanged.addListener(() =&gt; {
-    const exp = "$0 &amp;&amp; $0.tagName";
+  browser.devtools.panels.elements.onSelectionChanged.addListener(() => {
+    const exp = "$0 && $0.tagName";
     const title = "Selected Element tagName";
     sidebarPane.setExpression(exp, title);
   });
@@ -65,17 +65,15 @@ original_slug: >-
 }
 
 browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
-</pre>
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -102,5 +100,4 @@ browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.md
index dda73e1faa..24de71bf9c 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.md
@@ -15,44 +15,44 @@ translation_of: >-
 original_slug: >-
   Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setObject
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Affiche un objet JSON dans le volet de la barre latérale de l'extension.</p>
+Affiche un objet JSON dans le volet de la barre latérale de l'extension.
 
-<p>L'objet est affiché en tant qu'arborescence extensible, comme dans le <a href="/fr/docs/Outils/JSON_viewer">JSON viewer</a> dans Firefox. Vous pouvez éventuellement spécifier une chaîne <code>rootTitle</code> : elle sera affichée comme le titre de la racine de l'arbre.</p>
+L'objet est affiché en tant qu'arborescence extensible, comme dans le [JSON viewer](/fr/docs/Outils/JSON_viewer) dans Firefox. Vous pouvez éventuellement spécifier une chaîne `rootTitle` : elle sera affichée comme le titre de la racine de l'arbre.
 
-<p>C'est une fonction asynchrone qui renvoie une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code>.</p>
+C'est une fonction asynchrone qui renvoie une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise).
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">var setting = browser.devtools.panels.setObject(
+```js
+var setting = browser.devtools.panels.setObject(
   jsonObject,       // string, array, or JSON object
   rootTitle         // string
 )
-</pre>
+```
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>jsonObject</code></dt>
- <dd><code>String</code> ou <code>Array</code> ou <code>Object</code>. L'objet à afficher. S'il s'agit d'un objet JSON-serialized, donc les propriétés comme les fonctions seront omises.</dd>
- <dt><code>rootTitle</code> {{optional_inline}}</dt>
- <dd><code>String</code>. Le titre de la racine de l'arbre dans lequel l'objet est affiché.</dd>
-</dl>
+- `jsonObject`
+  - : `String` ou `Array` ou `Object`. L'objet à afficher. S'il s'agit d'un objet JSON-serialized, donc les propriétés comme les fonctions seront omises.
+- `rootTitle` {{optional_inline}}
+  - : `String`. Le titre de la racine de l'arbre dans lequel l'objet est affiché.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui sera accomplie sans arguments, une fois l'objet défini.</p>
+Une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui sera accomplie sans arguments, une fois l'objet défini.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setObject", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setObject", 10)}}
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Créez un nouveau volet et remplissez-le avec un objet JSON. Vous pouvez exécuter ce code dans un script chargé par la <a href="/fr/Add-ons/WebExtensions/manifest.json/devtools_page">page devtools</a>. de votre extension</p>
+Créez un nouveau volet et remplissez-le avec un objet JSON. Vous pouvez exécuter ce code dans un script chargé par la [page devtools](/fr/Add-ons/WebExtensions/manifest.json/devtools_page). de votre extension
 
-<pre class="brush: js">function onCreated(sidebarPane) {
+```js
+function onCreated(sidebarPane) {
   sidebarPane.setObject({
     someBool: true,
     someString: "hello there",
@@ -63,17 +63,16 @@ original_slug: >-
   });
 }
 
-browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);</pre>
+browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -100,5 +99,4 @@ browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);</
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.md
index 7d3651cbeb..16cb4740c3 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.md
@@ -11,52 +11,50 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setPage
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setPage
 ---
-<p>Définit une page HTML à afficher dans le volet latéral.</p>
+Définit une page HTML à afficher dans le volet latéral.
 
-<p>C'est une fonction asynchrone qui renvoie une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code>.</p>
+C'est une fonction asynchrone qui renvoie une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise).
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">browser.devtools.panels.setPage(
+```js
+browser.devtools.panels.setPage(
   path // string containing relative path to page
 )
-</pre>
+```
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt>extensionPageURL</dt>
- <dd><code>string</code>. Le chemin relatif d'une page HTML à afficher dans la barre latérale.</dd>
-</dl>
+- extensionPageURL
+  - : `string`. Le chemin relatif d'une page HTML à afficher dans la barre latérale.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui sera tenue sans arguments, une fois l'URL définie.</p>
+Une [`Promise`](/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise) qui sera tenue sans arguments, une fois l'URL définie.
 
-<p>La page sélectionnée ne sera pas chargée tant que l'utilisateur n'aura pas sélectionné la barre latérale devtools.</p>
+La page sélectionnée ne sera pas chargée tant que l'utilisateur n'aura pas sélectionné la barre latérale devtools.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Créez un nouveau volet et remplissez-le d'une page HTML. Vous pouvez exécuter ce code dans un script chargé par la <a href="/fr/Add-ons/WebExtensions/manifest.json/devtools_page">page devtools</a> de votre extension.</p>
+Créez un nouveau volet et remplissez-le d'une page HTML. Vous pouvez exécuter ce code dans un script chargé par la [page devtools](/fr/Add-ons/WebExtensions/manifest.json/devtools_page) de votre extension.
 
-<pre class="brush: js">function onCreated(sidebarPane) {
+```js
+function onCreated(sidebarPane) {
   sidebarPane.setPage('sidebar/sidebar.html');
 }
-</pre>
+```
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setPage", 10)}}</p>
+{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setPage", 10)}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -82,5 +80,4 @@ original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSideba
 // DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
-// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.</pre>
-</div>
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.md
index b144733c9b..76a93a2854 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.md
@@ -11,69 +11,57 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels
 ---
-<div>{{AddonSidebar}}</div>
+{{AddonSidebar}}
 
-<div class="note">
-<p><strong>Note :</strong> Bien que les API soient basées sur les <a href="https://developer.chrome.com/extensions/devtools">APIs de devtools de Chrome</a>, il existe encore de nombreuses fonctionnalités qui ne sont pas encore implémentées dans Firefox et ne sont donc pas documentées ici. Pour voir les fonctionnalités actuellement manquantes, regarder  <a href="/fr/Add-ons/WebExtensions/Using_the_devtools_APIs#Limitations_of_the_devtools_APIs">Limitations des APIs devtools</a>.</p>
-</div>
+> **Note :** Bien que les API soient basées sur les [APIs de devtools de Chrome](https://developer.chrome.com/extensions/devtools), il existe encore de nombreuses fonctionnalités qui ne sont pas encore implémentées dans Firefox et ne sont donc pas documentées ici. Pour voir les fonctionnalités actuellement manquantes, regarder  [Limitations des APIs devtools](/fr/Add-ons/WebExtensions/Using_the_devtools_APIs#Limitations_of_the_devtools_APIs).
 
-<p>L'API devtools.panels permet à une extension devtools de définir son interface utilisateur à l'intérieur de la fenêtre devtools.</p>
+L'API devtools.panels permet à une extension devtools de définir son interface utilisateur à l'intérieur de la fenêtre devtools.
 
-<p>La fenêtre devtools héberge un certain nombre d'outils distincts - le débogueur JavaScript, le moniteur réseau, etc. Une rangée d'onglets sur le haut permet à l'utilisateur de basculer entre les différents outils. La fenêtre hébergeant l'interface utilisateur de chaque outil s'appelle un "panneau".</p>
+La fenêtre devtools héberge un certain nombre d'outils distincts - le débogueur JavaScript, le moniteur réseau, etc. Une rangée d'onglets sur le haut permet à l'utilisateur de basculer entre les différents outils. La fenêtre hébergeant l'interface utilisateur de chaque outil s'appelle un "panneau".
 
-<p>Avec l'API devtools.panels, vous pouvez créer de nouveaux panneaux dans la fenêtre des devtools.</p>
+Avec l'API devtools.panels, vous pouvez créer de nouveaux panneaux dans la fenêtre des devtools.
 
-<p>Comme toutes les API de devtools, cette API est uniquement disponible pour le code exécuté dans le document défini dans la clé <a href="/fr/Add-ons/WebExtensions/manifest.json/devtools_page">devtools_page</a> du manifest.json, ou dans d'autres documents de déploiement créés par une extension (tel que le document du panneau). Voir <a href="/fr/Add-ons/WebExtensions/Extending_the_developer_tools">Extension des outils de développement</a> pour plus for d'informations.</p>
+Comme toutes les API de devtools, cette API est uniquement disponible pour le code exécuté dans le document défini dans la clé [devtools_page](/fr/Add-ons/WebExtensions/manifest.json/devtools_page) du manifest.json, ou dans d'autres documents de déploiement créés par une extension (tel que le document du panneau). Voir [Extension des outils de développement](/fr/Add-ons/WebExtensions/Extending_the_developer_tools) pour plus for d'informations.
 
-<h2 id="Types">Types</h2>
+## Types
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel">devtools.panels.ElementsPanel</a></code></dt>
- <dd>Représente l'inspecteur HTML/CSS dans le devtools du navigateur</dd>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel">devtools.panels.ExtensionPanel</a></code></dt>
- <dd>Représente un panneau de déploiement créé par l'extension.</dd>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane">devtools.panels.ExtensionSidebarPane</a></code></dt>
- <dd>Représente un volet ajouté par une extension à l'inspecteur HTML/CC dans les devtools du navigateur.</dd>
-</dl>
+- [`devtools.panels.ElementsPanel`](/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel)
+  - : Représente l'inspecteur HTML/CSS dans le devtools du navigateur
+- [`devtools.panels.ExtensionPanel`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel)
+  - : Représente un panneau de déploiement créé par l'extension.
+- [`devtools.panels.ExtensionSidebarPane`](/fr/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane)
+  - : Représente un volet ajouté par une extension à l'inspecteur HTML/CC dans les devtools du navigateur.
 
-<h2 id="Propriétés">Propriétés</h2>
+## Propriétés
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/elements">devtools.panels.elements</a></code></dt>
- <dd>Une référence à un objet <code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel">ElementsPanel</a></code>.</dd>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/themeName">devtools.panels.themeName</a></code></dt>
- <dd>Le nom du thème actuel des devtools.</dd>
-</dl>
+- [`devtools.panels.elements`](/fr/Add-ons/WebExtensions/API/devtools.panels/elements)
+  - : Une référence à un objet [`ElementsPanel`](/fr/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel).
+- [`devtools.panels.themeName`](/fr/Add-ons/WebExtensions/API/devtools.panels/themeName)
+  - : Le nom du thème actuel des devtools.
 
-<h2 id="Fonctions">Fonctions</h2>
+## Fonctions
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/create">devtools.panels.create()</a></code></dt>
- <dd>Créé un nouveau panneau de développement</dd>
-</dl>
+- [`devtools.panels.create()`](/fr/Add-ons/WebExtensions/API/devtools.panels/create)
+  - : Créé un nouveau panneau de développement
 
-<h2 id="Evénements">Evénements</h2>
+## Evénements
 
-<dl>
- <dt><code><a href="/fr/Add-ons/WebExtensions/API/devtools.panels/onThemeChanged">devtools.panels.onThemeChanged</a></code></dt>
- <dd>Mise en place lorsque le thème Devtools change.</dd>
-</dl>
+- [`devtools.panels.onThemeChanged`](/fr/Add-ons/WebExtensions/API/devtools.panels/onThemeChanged)
+  - : Mise en place lorsque le thème Devtools change.
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels", 2)}}</p>
+{{Compat("webextensions.api.devtools.panels", 2)}}
 
-<p>{{WebExtExamples("h2")}}</p>
+{{WebExtExamples("h2")}}
 
-<div class="note"><p><strong>Note :</strong></p>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
-
-<div class="hidden">
-<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+<div class="hidden"><pre>// Copyright 2015 The Chromium Authors. All rights reserved.
 //
 // Redistribution and use in source and binary forms, with or without
 // modification, are permitted provided that the following conditions are
@@ -100,5 +88,4 @@ original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels
 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-</pre>
-</div>
+</pre></div>
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.md
index 757f74684b..2c4351f95d 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.md
@@ -12,60 +12,54 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/onThemeChanged
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/onThemeChanged
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Remplacement quand le thème de devtools change</p>
+Remplacement quand le thème de devtools change
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="brush: js">browser.devtools.panels.onThemeChanged.addListener(listener)
+```js
+browser.devtools.panels.onThemeChanged.addListener(listener)
 browser.devtools.panels.onThemeChanged.removeListener(listener)
 browser.devtools.panels.onThemeChanged.hasListener(listener)
-</pre>
+```
 
-<p>Les événements ont trois fonctions :</p>
+Les événements ont trois fonctions :
 
-<dl>
- <dt><code>addListener(callback)</code></dt>
- <dd>Ajoute un auditeur à cet événement</dd>
- <dt><code>removeListener(listener)</code></dt>
- <dd>Arrêtez d'écouter cet événement. L'argument de l'auditeur est l'auditeur à supprimer.</dd>
- <dt><code>hasListener(listener)</code></dt>
- <dd>Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie Vrai si elle écoute, sinon Faux.</dd>
-</dl>
+- `addListener(callback)`
+  - : Ajoute un auditeur à cet événement
+- `removeListener(listener)`
+  - : Arrêtez d'écouter cet événement. L'argument de l'auditeur est l'auditeur à supprimer.
+- `hasListener(listener)`
+  - : Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie Vrai si elle écoute, sinon Faux.
 
-<h2 id="Syntaxe_addListener">Syntaxe addListener</h2>
+## Syntaxe addListener
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>callback</code></dt>
- <dd>
- <p>Function qui sera appelée lors de l'événement. La fonction passera les arguments suivants :</p>
+- `callback`
 
- <dl>
-  <dt><code>themeName</code></dt>
-  <dd><code>string</code>. Nom du nouveau thème : ce sera l'une des valeurs autorisées pour  <code><a href="/fr/docs/Mozilla/Add-ons/WebExtensions/API/devtools.panels/themeName">devtools.panels.themeName</a></code>.</dd>
- </dl>
- </dd>
-</dl>
+  - : Function qui sera appelée lors de l'événement. La fonction passera les arguments suivants :
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+    - `themeName`
+      - : `string`. Nom du nouveau thème : ce sera l'une des valeurs autorisées pour  [`devtools.panels.themeName`](/fr/docs/Mozilla/Add-ons/WebExtensions/API/devtools.panels/themeName).
 
-<p>{{Compat("webextensions.api.devtools.panels.onThemeChanged")}}</p>
+## Compatibilité du navigateur
 
-<h2 id="Exemples">Exemples</h2>
+{{Compat("webextensions.api.devtools.panels.onThemeChanged")}}
 
-<pre class="brush: js">browser.devtools.panels.onThemeChanged.addListener((newThemeName) =&gt; {
+## Exemples
+
+```js
+browser.devtools.panels.onThemeChanged.addListener((newThemeName) => {
   console.log(`New theme: ${newThemeName}`);
 });
-</pre>
-
-<p>{{WebExtExamples}}</p>
-
-<div class="note"><p><strong>Note :</strong></p>
+```
 
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
+{{WebExtExamples}}
 
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.md
index 12aab2c1b1..6f03f1c16a 100644
--- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.md
+++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.md
@@ -12,27 +12,24 @@ tags:
 translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/themeName
 original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/themeName
 ---
-<div>{{AddonSidebar()}}</div>
+{{AddonSidebar()}}
 
-<p>Le nom du thème de <strong>devtools</strong> actuellement sélectionné.</p>
+Le nom du thème de **devtools** actuellement sélectionné.
 
-<p>Il s'agit d'une chaîne dont les valeurs possibles sont :</p>
+Il s'agit d'une chaîne dont les valeurs possibles sont :
 
-<ul>
- <li>"lumière"</li>
- <li>"foncé"</li>
- <li>"firebug"</li>
-</ul>
+- "lumière"
+- "foncé"
+- "firebug"
 
-<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+## Compatibilité du navigateur
 
-<p>{{Compat("webextensions.api.devtools.panels.themeName")}}</p>
+{{Compat("webextensions.api.devtools.panels.themeName")}}
 
-<p>{{WebExtExamples}}</p>
+{{WebExtExamples}}
 
-<div class="note"><p><strong>Note :</strong></p>
-
-<p>Cette API est basée sur l'API Chromium <a href="https://developer.chrome.com/extensions/devtools_panels"><code>chrome.devtools.panels</code></a>.</p>
-
-<p>Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.</p>
-</div>
+> **Note :**
+>
+> Cette API est basée sur l'API Chromium [`chrome.devtools.panels`](https://developer.chrome.com/extensions/devtools_panels).
+>
+> Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.