diff options
Diffstat (limited to 'files/fr/web')
565 files changed, 3720 insertions, 3536 deletions
diff --git a/files/fr/web/api/documentorshadowroot/elementfrompoint/index.html b/files/fr/web/api/document/elementfrompoint/index.html index 142ab83b27..8da838500d 100644 --- a/files/fr/web/api/documentorshadowroot/elementfrompoint/index.html +++ b/files/fr/web/api/document/elementfrompoint/index.html @@ -1,11 +1,11 @@ --- title: document.elementFromPoint -slug: Web/API/DocumentOrShadowRoot/elementFromPoint +slug: Web/API/Document/elementFromPoint tags: - Référence_du_DOM_Gecko translation_of: Web/API/DocumentOrShadowRoot/elementFromPoint translation_of_original: Web/API/Document/elementFromPoint -original_slug: Web/API/Document/elementFromPoint +original_slug: Web/API/DocumentOrShadowRoot/elementFromPoint --- <p>{{ ApiRef() }}</p> <h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> diff --git a/files/fr/web/api/documentorshadowroot/elementsfrompoint/index.html b/files/fr/web/api/document/elementsfrompoint/index.html index c3f8c30d22..c0fb412fc8 100644 --- a/files/fr/web/api/documentorshadowroot/elementsfrompoint/index.html +++ b/files/fr/web/api/document/elementsfrompoint/index.html @@ -1,6 +1,6 @@ --- title: DocumentOrShadowRoot.elementsFromPoint() -slug: Web/API/DocumentOrShadowRoot/elementsFromPoint +slug: Web/API/Document/elementsFromPoint tags: - API - Document @@ -12,6 +12,7 @@ tags: - elementsFromPoint() - shadow dom translation_of: Web/API/DocumentOrShadowRoot/elementsFromPoint +original_slug: Web/API/DocumentOrShadowRoot/elementsFromPoint --- <div>{{APIRef("DOM")}}{{SeeCompatTable}}</div> diff --git a/files/fr/web/api/document/execcommand/index.html b/files/fr/web/api/document/execcommand/index.html index dd90b03485..77a39c36d2 100644 --- a/files/fr/web/api/document/execcommand/index.html +++ b/files/fr/web/api/document/execcommand/index.html @@ -3,395 +3,266 @@ title: document.execCommand slug: Web/API/Document/execCommand tags: - API - - Commandes - DOM - - Exécution + - Method - Méthodes + - Reference translation_of: Web/API/Document/execCommand --- -<p>{{ApiRef("DOM")}}<br> - Lorsqu'un document HTML est passé à <code><a href="https://developer.mozilla.org/fr/docs/Web/API/Document/designMode">designMode</a></code>, l'objet document expose la méthode <strong><code>execCommand</code></strong> qui permet d'exécuter des commandes pour manipuler le contenu de la zone modifiable, telle que les éléments <a href="https://developer.mozilla.org/fr/docs/Web/HTML/Element/input">form inputs</a> ou <code><a href="https://developer.mozilla.org/fr/docs/Web/HTML/Global_attributes/contenteditable">contentEditable</a></code> .</p> +<div>{{ApiRef("DOM")}}{{deprecated_header}}</div> -<p>La plupart des commandes affectent la <a href="https://developer.mozilla.org/fr/docs/Web/API/Selection">sélection</a> du document (gras, italique, etc.), tandis que d'autres ajoutent de nouveaux éléments (ajout d'un lien) ou affectent une ligne entière (indentation). Lorsque vous utilisez <code>contentEditable</code>, l'appel <code>execCommand()</code> affectera l'élément modifiable actuellement actif.</p> +<p><span class="seoSummary">Lorsqu'un document HTML passe en + <code><a href="/fr/docs/Web/API/Document/designMode">designMode</a></code>, l'objet + <code>document</code> correspondant expose une méthode <strong><code>execCommand()</code></strong> + permettant d'exécuter des commandes manipulant la région éditable courante tels que <a + href="/fr/docs/Web/HTML/Element/input">les champs de formulaire</a> ou les éléments + <code><a href="/fr/docs/Web/HTML/Global_attributes/contenteditable">contentEditable</a></code> + .</span></p> -<h2 id="Syntaxe">Syntaxe</h2> +<p>La plupart des commandes affectent la <a + href="/fr/docs/Web/API/Selection">sélection</a> du document (mise en gras, italique, etc.), tandis que + d'autres insèrent de nouveaux éléments (un lien) ou modifient toute une ligne (indentation). Lorsqu'on + utilise <code>contentEditable</code>, <code>execCommand()</code> affecte l'élément éditable + courant.</p> -<pre><em>bool</em> = document.execCommand(<em>aCommandName</em>, <em>aShowDefaultUI</em>, <em>aValueArgument</em>)</pre> +<h2 id="Syntax">Syntaxe</h2> -<h3 id="Valeur_retournée">Valeur retournée</h3> +<pre class="brush: js"><var>document</var>.execCommand(<var>aCommandName</var>, <var>aShowDefaultUI</var>, <var>aValueArgument</var>) +</pre> -<p>Un {{jsxref('Boolean')}} qui est à <code>false</code> <em>(faux)</em> si la commande n'est pas supportée ou désactivée.</p> +<h3 id="Return_value">Valeur de retour</h3> + +<p>Un booléen ({{jsxref('Boolean')}}) qui vaut <code>false</code> si la commande n'est pas + prise en charge ou si elle est désactivée.</p> <div class="note"> -<p><strong> </strong><span id="result_box" lang="fr"><span><strong>Note :</strong> Ne renvoie <code>true</code> <em>(vrai)</em> que dans le contexte d'une interaction utilisateur. Ne pas utiliser la valeur de retour pour vérifier le support du navigateur avant d'appeler une commande.</span></span></p> + <p><strong>Note</strong> : <code><var>document</var>.execCommand()</code> ne renvoie + <code>true</code> que s'il est appelé à partir d'une interaction utilisateur. On ne + peut pas l'invoquer dans un script afin de vérifier la prise en charge navigateur avant + d'appeler une commande. À partir de Firefox 82, les appels imbriqués à + <code>document.execCommand()</code> renverront toujours <code>false</code>.</p> </div> -<h3 id="Paramètres">Paramètres</h3> - -<p><code><strong>aCommandName</strong></code><br> - {{domxref("DOMString")}} spécifie le nom de la commande à exécuter . Voir {{anch("Commands")}} pour la liste des commandes possibles .</p> - -<p><strong><code>aShowDefaultUI</code></strong><br> - Un {{jsxref("Boolean")}} indiquant si l'interface utilisateur par défaut doit être affichée. Ceci n'est pas implémenté par Mozilla.</p> - -<p><strong><code>aValueArgument</code></strong><br> - Pour les commandes qui nécessitent un argument , il s'agit d'une {{domxref ("DOMString")}} <em>(chaîne de caractères)</em> fournissant ces informations. Par exemple, <code>insertImage</code> requière l'URL de l'image à insérer. Spécifiez <code>null </code>si aucun argument n'est nécessaire.</p> - -<h3 id="Commandes"><a id="Commands" name="Commands">Commandes</a></h3> - -<p><code><strong>backColor</strong></code><br> - Change la couleur d'arrière-plan du document. En mode <code>styleWithCss</code>, il affecte plutôt la couleur de fond du bloc contenant. Cela nécessite une chaîne de valeurs {{cssxref ("<color>")}} pour être transmise en tant qu'argument de valeur. Notez que Internet Explorer utilise cette option pour définir la couleur d'arrière-plan du texte.</p> - -<p><code><strong>bold</strong></code><br> - Ajoute ou enlève l'affichage <code>bold</code> de la sélection ou au point d'insertion. Internet Explorer utilise la balise {{HTMLElement("strong")}} au lieu de {{HTMLElement("b")}}.</p> - -<p><strong><code>contentReadOnly</code></strong><br> - Rend le contenu du document en lecture seule ou modifiable. Cela nécessite qu'un booléen <code>true</code> / <code>false</code> soit transmis en tant qu'argument de valeur. (Non pris en charge par Internet Explorer.)</p> - -<p><strong><code>copy</code></strong><br> - Copie la sélection courante dans le presse papier. Les conditions d'activation de ce comportement varient d'un navigateur à l'autre et ont évolué au fil du temps. Vérifiez la table de compatibilité pour déterminer si vous pouvez l'utiliser dans votre cas.</p> - -<p><code><strong>createLink</strong></code><br> - Crée un lien d'ancrage à partir de la sélection, uniquement s'il existe une sélection. Cela nécessite que la chaîne URI HREF soit transmise en tant qu'argument de valeur. L'URI doit contenir au moins un caractère unique, qui peut être un espace blanc. (Internet Explorer créera un lien avec une valeur URI <code>null</code>.)</p> - -<p><code><strong>cut</strong></code><br> - Coupe et copie la sélection courante dans le presse papier. Les conditions d'activation de ce comportement varient d'un navigateur à l'autre et ont évolué au fil du temps. Vérifiez la <a href="#Compatibilité des navigateurs">table de compatibilité</a> pour déterminer si vous pouvez l'utiliser dans votre cas.</p> - -<p><code><strong>decreaseFontSize</strong></code><br> - Ajoute une balise {{HTMLElement("small")}} autour de la sélection ou du point d'insertion (Non pris en charge par Internet Explorer).</p> +<h3 id="Parameters">Paramètres</h3> <dl> - <dt><code>defaultParagraphSeparator</code></dt> - <dd>Change le séparateur de paragraphes utilisé lorsque de nouveaux paragraphes sont créés dans les zones de textes modifiables. Voir <a href="https://developer.mozilla.org/fr/docs/Web/HTML/Contenu_editable#Differences_in_markup_generation">Contenu éditable</a> pour plus de détails.</dd> + <dt><code><var>aCommandName</var></code></dt> + <dd>Une chaîne de caractères {{domxref("DOMString")}} indiquant le nom de la commande à + exécuter. Voir {{anch("Commands")}} pour une liste de commandes possibles.</dd> + <dt><code><var>aShowDefaultUI</var></code></dt> + <dd>Un booléen ({{jsxref("Boolean")}}) indiquant si l'interface utilisateur par défaut + devrait être affichée. Ce n'est pas implémenté par Mozilla.</dd> + <dt><code><var>aValueArgument</var></code></dt> + <dd>Pour les commandes utilisant un argument en entrée, il s'agit d'une chaîne {{domxref("DOMString")}} + qui fournit cette information. On pourra, par exemple, <code>insertImage</code> utilise + l'URL de l'image à insérer. On utilisera <code>null</code> si aucun argument n'est utilisé.</dd> </dl> -<p><code><strong>delete</strong></code><br> - Supprime la sélection courante</p> - -<p><strong><code>enableInlineTableEditing</code></strong><br> - Active ou désactive les commandes d'insertion et de suppression des lignes et des colonnes du tableau. (Non pris en charge par Internet Explorer.)</p> - -<p><code><strong>enableObjectResizing</strong></code><br> - Active ou désactive les poignées de redimensionnement des images et autres objets redimensionnables. (Non pris en charge par Internet Explorer.)</p> - -<p><code><strong>fontName</strong></code><br> - Modifie le nom de police de la sélection ou du point d'insertion. Cela nécessite une chaîne de nom de police (tel qu'<code>"Arial"</code>) à transmettre comme argument de valeur.</p> - -<p><code><strong>fontSize</strong></code><br> - Modifie la taille de police pour la sélection ou au point d'insertion. Cela nécessite que la taille d'une police HTML (<code>1</code>-<code>7</code>) soit transmise en tant qu'argument de valeur.</p> - -<p><code><strong>foreColor</strong></code><br> - Modifie une couleur de police pour la sélection ou au point d'insertion. Cela nécessite qu'une chaîne de valeurs de couleur soit transmise en tant qu'argument de valeur.</p> - -<p><code><strong>formatBlock</strong></code><br> - Ajoute une balise HTML style bloc autour de la ligne contenant la sélection en cours, en remplaçant l'élément bloc contenant la ligne si elle existe (dans Firefox, BLOCKQUOTE est l'exception - il enroule tout élément bloc contenant). Nécessite la saisie d'une chaîne de nom d'étiquette comme argument de valeur. Pratiquement toutes les étiquettes de style de bloc peuvent être utilisées (par exemple "{{HTMLElement("h1")}}", "{{HTMLElement("p")}}", "{{HTMLElement("dl")}}", "{{HTMLElement("blockquote")}}"). (Internet Explorer ne prend en charge que les balises de titre <code>H1</code> - <code>H6</code>, <code>ADDRESS</code> et <code>PRE</code>, qui doivent également inclure les délimiteurs de balises <>, tels que <code>"<H1>"</code>.)</p> - -<p><code><strong>forwardDelete</strong></code><br> - Supprime le caractère avant la position du <a href="http://en.wikipedia.org/wiki/Cursor_%28computers%29">curseur</a>. Il est le même que frapper la touche de suppression.</p> - -<p><code><strong>heading</strong></code><br> - Ajoute une balise de titre autour d'une ligne de sélection ou d'insertion. Nécessite que la chaîne de nom d'étiquette soit transmise en tant qu'argument de valeur (c'est-à-dire "{{HTMLElement("<code>H1</code>")}}", "{{HTMLElement("<code>H6</code>")}}"). (Non pris en charge par Internet Explorer et Safari.)</p> - -<p><code><strong>hiliteColor</strong></code><br> - Modifie la couleur d'arrière-plan de la sélection ou du point d'insertion. Nécessite une chaîne de valeurs de couleur à transmettre comme argument de valeur. <code>UseCSS</code> doit être à <code>true</code> (<em>vrai</em>) pour que cela fonctionne. (Non pris en charge par Internet Explorer.)</p> - -<p><code><strong>increaseFontSize</strong></code><br> - Ajoute une balise {{HTMLElement("big")}} autour de la sélection ou au point d'insertion. (Non pris en charge par Internet Explorer.)</p> - -<p><code><strong>indent</strong></code><br> - Décale la ligne contenant le point de sélection ou d'insertion. Dans Firefox, si la sélection s'étend sur plusieurs lignes à différents niveaux d'indentation, seules les lignes les moins indentées de la sélection seront indentées.</p> - -<p><code><strong>insertBrOnReturn</strong></code><br> - Contrôle si la touche Entrée insère une balise br ou divise l'élément de bloc courant en deux. (Non pris en charge par Internet Explorer.)</p> - -<p><strong><code>insertHorizontalRule</code></strong><br> - Insère une ligne horizontale au point d'insertion. (Supprime la sélection)</p> - -<p><code><strong>insertHTML</strong></code><br> - Insère une chaîne HTML au point d'insertion (supprime la sélection). Nécessite une chaîne HTML valide à transmettre en tant qu'argument de valeur. (Non pris en charge par Internet Explorer.)</p> - -<p><code><strong>insertImage</strong></code><br> - Insère une image au point d'insertion (supprime la sélection). Nécessite l'image SRC URI chaîne à passer comme un argument de valeur. L'URI doit contenir au moins un caractère unique, qui peut être un espace blanc. (Internet Explorer créera un lien avec une valeur URI nulle.)</p> - -<p><code><strong>insertOrderedList</strong></code><br> - Crée une <a href="https://developer.mozilla.org/fr/docs/Web/HTML/Element/ol">liste ordonnée numérotée</a> pour la sélection ou le point d'insertion.</p> - -<p><code><strong>insertUnorderedList</strong></code><br> - Crée une <a href="https://developer.mozilla.org/fr/docs/Web/HTML/Element/ul">liste non triée à puces</a> pour la sélection ou au point d'insertion.</p> - -<p><code><strong>insertParagraph</strong></code><br> - Insère un <a href="https://developer.mozilla.org/fr/docs/Web/HTML/Element/p">paragraphe</a> autour de la sélection ou de la ligne en cours. (Internet Explorer insère un paragraphe au point d'insertion et supprime la sélection.)</p> +<h3 id="Commands">Commandes</h3> -<p><code><strong>insertText</strong></code><br> - Insère le texte brut donné au point d'insertion (supprime la sélection).</p> - -<p><code><strong>italic</strong></code><br> - Active / désactive l'italique pour la sélection ou le point d'insertion. (Internet Explorer utilise la balise {{HTMLElement("em")}} au lieu de {{HTMLElement("i")}}).</p> - -<p><code><strong>justifyCenter</strong></code><br> - Centre le point de sélection ou d'insertion.</p> - -<p><code><strong>justifyFull</strong></code><br> - Justifie le point de sélection ou d'insertion.</p> - -<p><code><strong>justifyLeft</strong></code><br> - Justifie le point de sélection ou d'insertion à gauche.</p> - -<p><code><strong>justifyRight</strong></code><br> - Justifie à droite la sélection ou le point d'insertion.</p> - -<p><code><strong>outdent</strong></code><br> - Augmente la ligne contenant le point de sélection ou d'insertion.</p> - -<p><code><strong>paste</strong></code><br> - Colle le contenu du Presse-papiers au point d'insertion (remplace la sélection en cours). La fonctionnalité Presse-papiers doit être activée dans le fichier de préférences <em>user.js</em>. Voir [1].</p> - -<p><code><strong>redo</strong></code><br> - Rétablit la commande d'annulation précédente.</p> - -<p><code><strong>removeFormat</strong></code><br> - Supprime tout le formatage de la sélection en cours.</p> - -<p><code><strong>selectAll</strong></code><br> - Sélectionne tout le contenu de la zone modifiable.</p> - -<p><code><strong>strikeThrough</strong></code><br> - Active ou désactive le barré pour la sélection ou le point d'insertion.</p> - -<p><code><strong>subscript</strong></code><br> - Active ou désactive l'<a href="https://developer.mozilla.org/fr/docs/Web/HTML/Element/sub">élément de souscription</a> sur la sélection ou au point d'insertion.</p> - -<p><code><strong>superscript</strong></code><br> - Active / désactive l'<a href="https://developer.mozilla.org/fr/docs/Web/HTML/Element/sup">élément de mise en exposant</a> pour la sélection ou le point d'insertion.</p> - -<p><code><strong>underline</strong></code><br> - Active ou désactive l'<a href="https://developer.mozilla.org/fr/docs/Web/HTML/Element/u">élément d'annotation non textuelle</a> pour la sélection ou le point d'insertion.</p> - -<p><code><strong>undo</strong></code><br> - Annule la dernière commande exécutée.</p> - -<p><code><strong>unlink</strong></code><br> - Supprime l'<a href="https://developer.mozilla.org/fr/docs/Web/HTML/Element/a">élément d'ancrage</a> de l'hyperlien sélectionné.</p> - -<p><code><strong>useCSS</strong></code><strong> {{Deprecated_inline}}</strong><br> - Active / désactive l'utilisation de balises HTML ou CSS pour le balisage généré. Nécessite un argument booléen vrai / faux comme argument de valeur. REMARQUE : Cet argument est logiquement inverse (c.-à-d. utilise <code>false</code> pour utiliser CSS, <code>true</code> pour utiliser HTML). (Non pris en charge par Internet Explorer.) Cela a été obsolète; Utilisez plutôt la commande <code>styleWithCSS</code>.</p> - -<p><code><strong>styleWithCSS</strong></code><br> - Remplace la commande <code>useCSS</code><em> </em>; argument fonctionne comme prévu, c'est-à-dire <code>true</code> modifie / génère des attributs de <code>style</code> dans le balisage, <code>false</code> génère des éléments de mise en forme.</p> +<dl> + <dt><code>backColor</code></dt> + <dd>Modifie la couleur d'arrière-plan du document. Avec le mode <code>styleWithCss</code> + cela affecte la couleur d'arrière-plan du bloc englobant. Une chaîne de caractères décrivant + une valeur {{cssxref("<color>")}} doit être passée en argument. + On notera qu'Internet Explorer utilise ceci pour la couleur d'arrière-plan du texte.</dd> + <dt><code>bold</code></dt> + <dd>Active ou désactive la mise en gras pour la sélection ou à partir du point d'insertion + Internet Explorer utilise la balise {{HTMLElement("strong")}} plutôt que {{HTMLElement("b")}}.</dd> + <dt><code>ClearAuthenticationCache</code></dt> + <dd>Supprime toutes les informations d'authentification (<i>credentials</i>) du cache.</dd> + <dt><code>contentReadOnly</code></dt> + <dd>Rend le contenu du document en lecture seule ou éditable en fonction du booléen passé + en argument (n'est pas pris en charge par Internet Explorer)</dd> + <dt><code>copy</code></dt> + <dd>Copie la sélection courante vers le presse-papier. Les conditions pour obtenir ce + comportement peuvent varier d'un navigateur à l'autre. Veuillez voir le tableau de + compatibilité ci-après.</dd> + <dt><code>createLink</code></dt> + <dd>Crée un hyperlien à partir de la sélection (sous réserve qu'il y en ait une). Une + chaîne de caractères formant un URI est nécessaire comme argument afin de fournir + la valeur de l'attribut <code>href</code>. L'URI doit contenir au moins un caractère + (qui peut être un blanc). (Internet Explorer créera un lien avec une valeur + <code>null</code>.)</dd> + <dt><code>cut</code></dt> + <dd>Coupe le contenu de la sélection courante et le copie dans le presse-papier. + Les conditions pour obtenir ce comportement peuvent varier d'un navigateur à l'autre. + Veuillez voir le tableau de compatibilité ci-après.</dd> + <dt><code>decreaseFontSize</code></dt> + <dd>Ajoute une balise {{HTMLElement("small")}} autour de la sélection ou au point + d'insertion. (Non pris en charge par Internet Explorer.)</dd> + <dt><code>defaultParagraphSeparator</code></dt> + <dd>Modifie le séparateur de paragraphe utilisé lorsque de nouveaux paragraphes sont + créés dans les zones de texte éditables. Voir <a + href="/fr/docs/Web/Guide/HTML/Editable_content#differences_in_markup_generation"> + Différences dans la génération du balisage</a> pour plus de détails.</dd> + <dt><code>delete</code></dt> + <dd>Supprimer la sélection courante.</dd> + <dt><code>enableAbsolutePositionEditor</code></dt> + <dd>Active ou désactive la poignée qui permet de déplacer les éléments positionnés de + façon absolue. Celle-ci est désactivée par défaut depuis Firefox 64 ({{bug(1490641)}}). + </dd> + <dt><code>enableInlineTableEditing</code></dt> + <dd>Active ou désactive les contrôles pour l'insertion ou la suppression des lignes ou + colonnes de tableau. Les contrôles sont désactivés par défaut depuis Firefox 64 + ({{bug(1490641)}}).</dd> + <dt><code>enableObjectResizing</code></dt> + <dd>Active ou désactive les contrôles permettant de redimensionner les images, tableaux + ou les éléments positionnés de façon absolue. Les poignées sont désactivées par défaut + depuis Firefox 64 ({{bug(1490641)}}).</dd> + <dt><code>fontName</code></dt> + <dd>Modifie le nom de la police pour la sélection ou à partir du point d'insertion. La + valeur fournie en argument doit être un nom de police (ex. <code>"Arial"</code>).</dd> + <dt><code>fontSize</code></dt> + <dd>Modifie la taille de la police pour la sélection ou à partir du point d'insertion. + La valeur fournie en argument doit être un entier compris entre 1 et 7.</dd> + <dt><code>foreColor</code></dt> + <dd>Modifie la couleur de la police pour la sélection ou à partir du point d'insertion. + La valeur passée en argument doit être une chaîne de caractères décrivant une couleur + exprimée en notation hexadécimale.</dd> + <dt><code>formatBlock</code></dt> + <dd>Ajoute un élément HTML de bloc autour de la ligne contenant la sélection courante et + remplace l'éventuel élément de bloc englobant s'il en existe un (pour Firefox, + {{HTMLElement("blockquote")}} fera exception et englobera n'importe quel bloc). + L'argument passé doit être un nom de balise. Tous les éléments de bloc peuvent en + théorie être utilisés. (Internet Explorer et Edge ne prennent en charge que les + balises <code>H1</code><code>H6</code>, <code>ADDRESS</code>, et <code>PRE</code> qui + doivent être passées entre chevrons : <code>"<H1>"</code>.)</dd> + <dt><code>forwardDelete</code></dt> + <dd>Supprime un caractère à la position du curseur. Le comportement obtenu est le même + que lorsqu'on appuie sur la touche <kbd>Suppr</kbd> d'un clavier Windows.</dd> + <dt><code>heading</code></dt> + <dd>Ajoute un élément de titre autour de la sélection ou au niveau du point d'insertion. + L'argument doit être le nom d'une balise de titre (<code>"H1"</code> à <code>"H6"</code>). + (Non pris en charge par Internet Explorer et Safari.)</dd> + <dt><code>hiliteColor</code></dt> + <dd>Modifie la couleur d'arrière-plan pour la sélection ou à partir du point d'insertion. + La valeur passée en argument doit être une chaîne de caractères définissant une couleur + et <code>useCSS</code> doit valoir <code>true</code>. (Non pris en charge par Internet + Explorer.)</dd> + <dt><code>increaseFontSize</code></dt> + <dd>Ajoute une balise {{HTMLElement("big")}} autour de la sélection ou à partir du point + d'insertion. (Non pris en charge par Internet Explorer).</dd> + <dt><code>indent</code></dt> + <dd>Augmente l'indentation de la ligne contenant la sélection ou le point d'insertion. + Pour Firefox, si la sélection s'étend sur plusieurs lignes ayant différents niveaux + d'indentation, seules les lignes les moins indentées seront décalées.</dd> + <dt><code>insertBrOnReturn</code></dt> + <dd>Contrôle si la touche <kbd>Entrée</kbd> insère un élément {{HTMLElement("br")}} ou + si le bloc courant est scindé en deux. (Non pris en charge par Internet Explorer.)</dd> + <dt><code>insertHorizontalRule</code></dt> + <dd>Insère un élément {{HTMLElement("hr")}} au point d'insertion ou remplace la + sélection courante par cet élément.</dd> + <dt><code>insertHTML</code></dt> + <dd>Insère un élément au point d'insertion en supprimant la sélection. Une chaîne de + caractères HTML valide doit être fournie en argument. (Non pris en charge par Internet + Explorer.)</dd> + <dt><code>insertImage</code></dt> + <dd>Insère une image au point d'insertion en supprimant la sélection. L'argument doit + être une chaîne de caractères indiquant l'URL à utiliser pour l'attribut + <code>src</code> de l'image. Les prérequis de cette valeur sont les mêmes que pour + <code>createLink</code>.</dd> + <dt><code>insertOrderedList</code></dt> + <dd>Crée une <a href="/fr/docs/Web/HTML/Element/ol">liste numérotée ordonnée</a> pour la + sélection ou à partir du point d'insertion.</dd> + <dt><code>insertUnorderedList</code></dt> + <dd>Crée une <a href="/fr/docs/Web/HTML/Element/ul">liste non-ordonnée</a> pour la + sélection ou à partir du point d'insertion.</dd> + <dt><code>insertParagraph</code></dt> + <dd>Insère un <a href="/fr/docs/Web/HTML/Element/p">paragraphe</a> autour de la sélection + pour la ligne courante. (Internet Explorer insère un paragraphe au point d'insertion + et supprime la sélection.)</dd> + <dt><code>insertText</code></dt> + <dd>Insère le texte indiqué au point d'insertion (quitte à supprimer l'éventuelle + sélection courante).</dd> + <dt><code>italic</code></dt> + <dd>Active ou désactive la mise en italique pour la sélection ou à partir du point + d'insertion. (Internet Explorer utilisera l'élément {{HTMLElement("em")}} plutôt que + {{HTMLElement("i")}}.)</dd> + <dt><code>justifyCenter</code></dt> + <dd>Centre la sélection ou le point d'insertion.</dd> + <dt><code>justifyFull</code></dt> + <dd>Justifie la sélection ou le point d'insertion.</dd> + <dt><code>justifyLeft</code></dt> + <dd>Justifie à gauche la sélection ou le point d'insertion.</dd> + <dt><code>justifyRight</code></dt> + <dd>Justifie à droite la sélection ou le point d'insertion.</dd> + <dt><code>outdent</code></dt> + <dd>Effectue un retrait d'indentation pour la ligne courante.</dd> + <dt><code>paste</code></dt> + <dd>Colle le contenu du presse-papier au point d'insertion (et remplace éventuellement + la sélection actuelle). Fonctionnalité désactivée pour le contenu web.</dd> + <dt><code>redo</code></dt> + <dd>Rejoue l'action annulée par la précédente commande <code>undo</code>.</dd> + <dt><code>removeFormat</code></dt> + <dd>Supprime toute mise en forme pour la sélection courante.</dd> + <dt><code>selectAll</code></dt> + <dd>Sélectionne l'ensemble du contenu de la région éditable.</dd> + <dt><code>strikeThrough</code></dt> + <dd>Active ou désactive la rayure de la sélection ou à partir d'un point d'insertion.</dd> + <dt><code>subscript</code></dt> + <dd>Active ou désactive <a href="/fr/docs/Web/HTML/Element/sub">la mise en indice</a> + pour la sélection ou au point d'insertion</dd> + <dt><code>superscript</code></dt> + <dd>Active ou désactive <a href="/fr/docs/Web/HTML/Element/sup">la mise en exposant</a> + pour la sélection ou au point d'insertion</dd> + <dt><code>underline</code></dt> + <dd>Active ou désactive <a href="/fr/docs/Web/HTML/Element/u">le soulignement</a> pour + la sélection ou au point d'insertion.</dd> + <dt><code>undo</code></dt> + <dd>Annule la dernière commande exécutée.</dd> + <dt><code>unlink</code></dt> + <dd>Retire l'<a href="/fr/docs/Web/HTML/Element/a">ancre</a> de l'hyperlien sélectionné. + </dd> + <dt><code>useCSS</code> {{Deprecated_inline}}</dt> + <dd>Active/désactive l'utilisation de balises HTML ou de CSS pour le balisage généré. La + valeur de l'argument doit être un booléen.</dd> + <dd>Note : cet argument possède une logique inversée (<code>false</code> permet + d'utiliser CSS et <code>true</code> permet d'utiliser HTML). Cette valeur n'est pas + prise en charge par Internet Explorer et a été dépréciée en faveur de + <code>styleWithCSS</code>.</dd> + <dt><code>styleWithCSS</code></dt> + <dd>Remplace la commande <code>useCSS</code>. <code>true</code> modifie/génère des + attributs <code>style</code> dans le balisage tandis que <code>false</code> génère des + éléments HTML de présentation.</dd> +</dl> -<h2 id="Exemple">Exemple</h2> +<h2 id="Example">Exemple</h2> -<p>Un <a href="http://codepen.io/netsi1964/full/QbLLGW/">exemple d'utilisation</a> sur CodePen.</p> +<p>Un exemple d'utilisation est disponible + <a href="https://codepen.io/chrisdavidmills/full/gzYjag/">sur CodePen</a>.</p> -<h2 id="Spécifications">Spécifications</h2> +<h2 id="Specifications">Spécifications</h2> <table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML Editing', '#execcommand()', 'execCommand')}}</td> - <td>{{Spec2('HTML Editing')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="https://w3c.github.io/editing/docs/execCommand/">execCommand</a></td> + <td>Brouillon non officiel</td> + <td></td> + </tr> + </tbody> </table> -<h2 id="Compatibilité_des_navigateurs"><a id="Compatibilité des navigateurs" name="Compatibilité des navigateurs"></a>Compatibilité des navigateurs</h2> - -<p>{{CompatibilityTable}}</p> - -<div id="compat-desktop" style="display: block;"> -<div id="compat-desktop"> -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Fonctionnalité</th> - <th>Chrome</th> - <th>Edge</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - <tr> - <td><code>insertBrOnReturn</code></td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - <tr> - <td><code>copy</code>/<code>cut</code></td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoDesktop(41)}}</td> - <td>9</td> - <td>29</td> - <td>10</td> - </tr> - <tr> - <td><code>defaultParagraphSeparator</code></td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoDesktop(55)}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatNo}}</td> - </tr> - <tr> - <td><code>ClearAuthenticationCache</code></td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatNo}}</td> - <td>6</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Fonctionnalité</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Edge</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - <tr> - <td><code>insertBrOnReturn</code></td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - <tr> - <td><code>copy</code>/<code>cut</code></td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoMobile(41)}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatNo}}</td> - </tr> - <tr> - <td><code>defaultParagraphSeparator</code></td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoMobile(55)}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatNo}}</td> - </tr> - <tr> - <td><code>ClearAuthenticationCache</code></td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - </div> - </div> - -<div id="compat-mobile" class="hidden"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Edge</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - <tr> - <td><code>insertBrOnReturn</code></td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - <tr> - <td><code>copy</code>/<code>cut</code></td> - <td>{{CompatNo}}</td> - <td>{{CompatChrome(43)}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoMobile(41)}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> -<p>[1] Avant Firefox 41, la capacité du presse-papiers devait être activée dans le fichier de préférences user.js. Voir <a href="https://developer.mozilla.org/fr/docs/Mozilla/Preferences/A_brief_guide_to_Mozilla_preferences">Un bref guide des préférences Mozilla</a> pour plus d'informations. Si la commande n'était pas prise en charge ou activée, <code>execCommand</code> déclenchait une exception au lieu de renvoyer <code>false</code>. Dans Firefox 41 et versions ultérieures, la capacité du presse-papiers est activée par défaut dans n'importe quel gestionnaire d'événements capable de faire apparaître une fenêtre (scripts semi-approuvés), mais aucun contenu web ne peut lire le presse-papier. Les extensions web peuvent <a href="https://developer.mozilla.org/fr/Add-ons/WebExtensions/interagir_avec_le_presse_papier">interagir avec le presse-papier</a>.</p> +<p>{{Compat("api.Document.execCommand")}}</p> -<h2 id="Voir_aussi">Voir aussi</h2> +<h2 id="See_also">Voir aussi</h2> <ul> - <li>{{domxref("HTMLElement.contentEditable")}}</li> - <li>{{domxref("document.designMode")}}</li> - <li><a href="https://developer.mozilla.org/fr/docs/Rich-Text_Editing_in_Mozilla">Rich-Text Editing in Mozilla</a></li> - <li><a href="https://github.com/guardian/scribe/blob/master/BROWSERINCONSISTENCIES.md">Scribe's "Browser Inconsistencies" documentation</a> <span class="short_text" id="result_box" lang="fr"><span>avec des bugs liés</span></span> à <code>document.execCommand</code>.{{CompatUnknown}}</li> + <li>{{domxref("HTMLElement.contentEditable")}}</li> + <li>{{domxref("document.designMode")}}</li> + <li><a href="/fr/docs/Web/Guide/HTML/Editable_content/Rich-Text_Editing_in_Mozilla">L'édition HTML dans Firefox</a> + </li> + <li><a + href="https://github.com/guardian/scribe/blob/master/BROWSERINCONSISTENCIES.md">Documentation des incohérences + navigateur dans Scribe</a> qui indique les bugs liés à <code>document.execCommand</code>.</li> </ul> diff --git a/files/fr/web/api/documentorshadowroot/index.html b/files/fr/web/api/documentorshadowroot/index.html deleted file mode 100644 index d8dd814377..0000000000 --- a/files/fr/web/api/documentorshadowroot/index.html +++ /dev/null @@ -1,78 +0,0 @@ ---- -title: DocumentOrShadowRoot -slug: Web/API/DocumentOrShadowRoot -tags: - - API - - Document - - DocumentOrShadowRoot - - Interface - - Reference - - ShadowRoot - - shadow dom -translation_of: Web/API/DocumentOrShadowRoot ---- -<div>{{APIRef("Web Components")}}</div> - -<p><span class="seoSummary">Le <strong><code>DocumentOrShadowRoot</code></strong> mélange de l'<a href="/fr/docs/Web/Web_Components/Using_shadow_DOM">API Shadow DOM</a> qui fournit des API qui sont partagées entre les documents et les racines fantômes. Les fonctionnalités suivantes sont incluses dans {{DOMxRef("Document")}} et {{DOMxRef("ShadowRoot")}}.</span></p> - -<h2 id="Propriétés">Propriétés</h2> - -<dl> - <dt>{{DOMxRef("DocumentOrShadowRoot.activeElement")}}{{ReadOnlyInline}}</dt> - <dd>Renvoie l'{{DOMxRef('Element')}} dans l'arbre <code>shadow</code> qui a le focus.</dd> - <dt>{{DOMxRef("DocumentOrShadowRoot.fullscreenElement")}}{{ReadOnlyInline}}</dt> - <dd>Renvoie l'{{DOMxRef('Element')}} qui est actuellement en mode plein écran pour ce document.</dd> - <dt>{{DOMxRef("DocumentOrShadowRoot.pointerLockElement")}} {{Experimental_Inline}}{{ReadOnlyInline}}</dt> - <dd>Renvoie l'élément défini comme cible pour les événements de la souris lorsque le pointeur est verrouillé. Il renvoie <code>null</code> si le verrouillage est en cours, si le pointeur est déverrouillé ou si la cible se trouve dans un autre document.</dd> - <dt>{{DOMxRef("DocumentOrShadowRoot.styleSheets")}}{{ReadOnlyInline}}</dt> - <dd>Renvoie une {{DOMxRef('StyleSheetList')}} d'objets {{DOMxRef('CSSStyleSheet')}} pour les feuilles de style explicitement liées ou intégrées dans un document.</dd> -</dl> - -<h2 id="Méthodes">Méthodes</h2> - -<dl> - <dt>{{DOMxRef("DocumentOrShadowRoot.caretPositionFromPoint()")}}</dt> - <dd>Renvoie un objet {{DOMxRef('CaretPosition')}} contenant le noeud DOM contenant le signe d'insertion, et le décalage du caractère d'insertion dans ce noeud.</dd> - <dt>{{DOMxRef("DocumentOrShadowRoot.elementFromPoint()")}}</dt> - <dd>Renvoie l'élément le plus élevé aux coordonnées spécifiées.</dd> - <dt>{{DOMxRef("DocumentOrShadowRoot.elementsFromPoint()")}}</dt> - <dd>Renvoie un tableau de tous les éléments aux coordonnées spécifiées.</dd> - <dt>{{DOMxRef("DocumentOrShadowRoot.getSelection()")}}</dt> - <dd>Renvoie un objet {{DOMxRef('Selection')}} représentant la plage de texte sélectionnée par l'utilisateur, ou la position actuelle du curseur.</dd> - <dt>{{DOMxRef("DocumentOrShadowRoot.nodeFromPoint()")}} {{non-standard_inline}}</dt> - <dd>Renvoie le nœud supérieur aux coordonnées spécifiées.</dd> - <dt>{{DOMxRef("DocumentOrShadowRoot.nodesFromPoint()")}} {{non-standard_inline}}</dt> - <dd>Renvoie un tableau de tous les nœuds aux coordonnées spécifiées.</dd> -</dl> - -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('Shadow DOM','#extensions-to-the-documentorshadowroot-mixin','DocumentOrShadowRoot')}}</td> - <td>{{Spec2('Shadow DOM')}}</td> - <td>Implémentation de Shadow DOM.</td> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG','#mixin-documentorshadowroot','DocumentOrShadowRoot')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une <em>pull request</em>.</div> - -<p>{{Compat("api.DocumentOrShadowRoot")}}</p> - -<p>[1] Les fonctionnalités de cette interface sont toujours implémentées sur l'objet {{DOMxRef("Document")}}.</p> diff --git a/files/fr/web/api/eventtarget/addeventlistener/index.html b/files/fr/web/api/eventtarget/addeventlistener/index.html index 6d8e092656..c8e6650d62 100644 --- a/files/fr/web/api/eventtarget/addeventlistener/index.html +++ b/files/fr/web/api/eventtarget/addeventlistener/index.html @@ -15,135 +15,160 @@ tags: - attachEvent - Écouteurs - Écouteurs d'Évènements + - AccessOuterData + - Detecting Events + - Event Handlers + - Event Listener + - EventTarget + - Method + - PassingData + - Receiving Events + - addEventListener + - events + - mselementresize translation_of: Web/API/EventTarget/addEventListener --- <p>{{APIRef("DOM Events")}}</p> -<p>La méthode <code><strong>addEventListener()</strong></code> d'{{domxref("EventTarget")}} installe une fonction à appeler chaque fois que l'événement spécifié est envoyé à la cible. Les cibles courantes sont un {{domxref("Element")}}, le {{domxref("Document")}} lui-même et une {{domxref("Window")}}, mais elle peut être tout objet prenant en charge les évènements (comme <code><a href="https://developer.mozilla.org/fr/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code>).</p> +<p><span class="seoSummary">La méthode <code><strong>addEventListener()</strong></code> de {{domxref("EventTarget")}} attache une fonction à appeler chaque fois que l'évènement spécifié est envoyé à la cible.</span> Les cibles courantes sont un {{domxref("Element")}}, le {{domxref("Document")}} lui-même et une {{domxref("Window")}}, mais on peut tout à fait cible n'importe quel objet prenant en charge les évènements (comme {{domxref("XMLHttpRequest")}}).</p> -<p><code>addEventListener()</code> fonctionne en ajoutant une fonction, ou un objet implémentant {{domxref("EventListener")}}, à la liste des écouteurs d'évènements du type d'évènement spécifié dans la {{domxref("EventTarget")}} dans laquelle il est appelé.</p> +<p><code>addEventListener()</code> agit en ajoutant une fonction ou un objet qui implémente {{domxref("EventListener")}} à la liste des gestionnaires d'évènement pour le type d'évènement spécifié sur la cible ({{domxref("EventTarget")}}) à partir de laquelle il est appelé.</p> -<h2 id="Syntaxe">Syntaxe</h2> +<h2 id="Syntax">Syntaxe</h2> -<pre class="syntaxbox notranslate"><em>target</em>.addEventListener(<em>type</em>, <em>écouteur [, </em><em>options</em>]); -<em>target</em>.addEventListener(<em>type</em>, <em>écouteur [, utiliserCapture</em>]); -<em>target</em>.addEventListener(<em>type</em>, <em>écouteur [, utiliserCapture</em>, <em>veutNonFiables </em>{{Non-standard_inline}}]); // Gecko/Mozilla seulement</pre> +<pre + class="brush: js"><var>target</var>.addEventListener(<var>type</var>, <var>listener</var> [, <var>options</var>]); +<var>target</var>.addEventListener(<var>type</var>, <var>listener</var> [, <var>useCapture</var>]); +<var>target</var>.addEventListener(<var>type</var>, <var>listener</var> [, <var>useCapture</var>, <var>wantsUntrusted</var> {{Non-standard_inline}}]); // Gecko/Mozilla uniquement</pre> -<h3 id="Paramètres">Paramètres</h3> + +<h3 id="Parameters">Paramètres</h3> <dl> - <dt><em><code>type</code></em> </dt> - <dd>Une chaîne sensible à la casse représentant le <a href="https://developer.mozilla.org/fr/docs/Web/Events">type d'évènement</a> à écouter.</dd> - <dt><code><var>écouteur</var></code></dt> - <dd>L'objet qui recevra une notification (un objet qui implémente l'interface {{domxref("Event")}}) lorsqu'un évènement du type spécifié se produit. Cela doit être un objet implémentant l'interface {{domxref("EventListener")}} ou une <a href="https://developer.mozilla.org/fr/docs/Web/JavaScript/Guide/Fonctions" title="fr/Référence_de_JavaScript_1.5_Core/Fonctions">fonction</a> JavaScript. Voir {{anch("The event listener callback")}} pour des détails sur le rappel lui-même.</dd> - <dt><code><var>options</var></code> {{optional_inline}}</dt> - <dd>Un objet options spécifie les caractéristiques de l'écouteur d'évènements. Les options disponibles sont : - <dl> - <dt><code>capture</code></dt> - <dd>Un {{jsxref("Boolean")}} indiquant que les évènements de ce type seront distribués à l'<code><var>écouteur</var></code> enregistré avant d'être distribués à tout <code>EventTarget</code> située en-dessous dans l'arborescence DOM.</dd> - <dt><code>once</code></dt> - <dd>Un {{jsxref("Boolean")}} indiquant que l'<em><code>écouteur</code></em> doit être invoqué au plus une fois après avoir été ajouté. Si <code>true</code> (<em>vrai</em>), l'<em><code>écouteur</code></em> sera automatiquement supprimé après son appel.</dd> - <dt><code>passive</code></dt> - <dd>Un {{jsxref("Boolean")}} qui, si <code>true</code>, indique que la fonction spécifiée par l'<em><code>écouteur</code></em> n'appellera jamais {{domxref("Event.preventDefault", "preventDefault()")}}. Si un écouteur passif appelle <code>preventDefault()</code>, l'agent utilisateur ne fera rien d'autre que de générer un avertissement sur la console. Voir {{anch("Amélioration des performances de défilement avec les écouteurs passifs")}} pour en apprendre davantage.</dd> - <dt>{{non-standard_inline}} <code>mozSystemGroup</code></dt> - <dd>Un {{jsxref("Boolean")}} indiquant que l'écouteur doit être ajouté au groupe système. Disponible seulement pour le code s'exécutant dans XBL ou dans le {{glossary("chrome")}} du navigateur Firefox.</dd> - </dl> - </dd> - <dt><code><var>utiliserCapture</var></code> {{optional_inline}}</dt> - <dd>Un {{jsxref("Boolean")}} indiquant si les événements de ce type seront distribués à l'<em><code>écouteur</code></em> enregistré <em>avant</em> d'être distribués à toute <code>EventTarget</code> (cible d'évènement) située en-dessous dans l'arborescence DOM. Les événements qui se propagent vers le haut dans l'arborescence ne déclencheront pas un écouteur indiqué comme utilisant la capture. La propagation et la capture d'événements sont deux manières de propager des événements qui se produisent dans un élément imbriqué dans un autre, lorsque les deux éléments ont enregistré un gestionnaire pour cet événement. Le mode de propagation de l'évènement détermine l'ordre dans lequel les éléments reçoivent l'événement. Voir les <a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-flow">DOM Level 3 Events</a> et <a href="http://www.quirksmode.org/js/events_order.html#link4">JavaScript Event order</a> pour une explication détaillée. Si non spécifié, <em><code>useCapture</code></em> a <code>false</code> pour valeur par défaut.</dd> + <dt><code>type</code></dt> + <dd>Une chaîne sensible à la casse représentant le <a href="/fr/docs/Web/Events">type d'évènement</a> à écouter.</dd> + <dt><code>listener</code></dt> + <dd>L'objet qui recevra un évènement (c'est-à-dire un objet qui implémente l'interface {{domxref("Event")}}) lorsqu'un évènement du type spécifié se produit. Cet argument doit être un objet implémentant l'interface {{domxref("EventListener")}} ou une <a href="/fr/docs/Web/JavaScript/Guide/Functions">fonction</a> JavaScript. Voir {{anch("The_event_listener_callback", "Fonction de rappel (<i>callback</i> pour le gestionnaire d'évènement)")}} pour plus de détails sur le fonctionnement d'une fonction de rappel.</dd> + <dt><code>options</code> {{optional_inline}}</dt> + <dd>Un objet options spécifie les caractéristiques de l'écouteur d'évènements. Les options disponibles sont : + <dl> + <dt><code>capture</code></dt> + <dd>Un booléen ({{jsxref("Boolean")}}) indiquant que les évènements de ce type seront distribués à l'<code><var>listener</var></code> enregistré avant d'être distribués à tout <code>EventTarget</code> située en dessous dans l'arborescence DOM.</dd> + <dt><code>once</code></dt> + <dd>Un booléen ({{jsxref("Boolean")}}) indiquant que <code>listener</code> doit être invoqué au plus une fois après avoir été ajouté. Si <code>true</code> (vrai), <code>listener</code> sera automatiquement supprimé après son appel.</dd> + <dt><code>passive</code></dt> + <dd>Un booléen ({{jsxref("Boolean")}}) qui, si <code>true</code>, indique que la fonction spécifiée par <code>listener</code> n'appellera jamais {{domxref("Event.preventDefault", "preventDefault()")}}. Si un écouteur passif appelle <code>preventDefault()</code>, l'agent utilisateur ne fera rien d'autre que de générer un avertissement dans la console. Voir {{anch("Improving_scrolling_performance_with_passive_listeners","Améliorer les performances du défilement avec des gestionnaires passifs")}} pour en apprendre davantage.</dd> + <dt><code>mozSystemGroup</code> {{non-standard_inline}}</dt> + <dd>Un booléen ({{jsxref("Boolean")}}) indiquant que l'écouteur doit être ajouté au groupe système. Disponible uniquement pour le code s'exécutant dans XBL ou dans le {{glossary("chrome")}} du navigateur Firefox.</dd> + </dl> + </dd> + <dt><code>useCapture</code> {{optional_inline}}</dt> + <dd>Un booléen ({{jsxref("Boolean")}}) indiquant si les évènements de ce type seront distribués au <code>listener</code> enregistré avant d'être distribués à toute <code>EventTarget</code> (« cible d'évènement ») située en dessous dans l'arborescence DOM. Les évènements qui se propagent vers le haut dans l'arborescence ne déclencheront pas un écouteur indiqué comme utilisant la capture. La propagation et la capture d'évènements sont deux manières de propager des évènements qui se produisent dans un élément imbriqué dans un autre, lorsque les deux éléments ont enregistré un gestionnaire pour cet évènement. Le mode de propagation de l'évènement détermine l'ordre dans lequel les éléments reçoivent l'évènement. Voir les <a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-flow">DOM Level 3 Events</a> et <a href="http://www.quirksmode.org/js/events_order.html#link4">JavaScript Event order</a> pour une explication détaillée. S'il n'est pas spécifié, <code>useCapture</code> aura <code>false</code> comme valeur par défaut.</dd> </dl> -<div class="note"> -<p><strong>Note : </strong>pour les écouteurs attachés à la cible d'évènement, l'évènement se trouve dans la phase cible, plutôt que dans les phases de propagation et de capture. Les évènements dans la phase cible déclencheront tous les écouteurs d'un élément dans l'ordre où ils ont été enregistrés, indépendamment du paramètre <em><code>useCapture</code></em>.</p> +<div class="notecard note"> + <p><strong>Note :</strong> Pour les écouteurs attachés à la cible d'évènement, l'évènement se trouve dans la phase cible, plutôt que dans les phases de propagation et de capture. Les évènements dans la phase cible déclencheront tous les écouteurs d'un élément dans l'ordre où ils ont été enregistrés, indépendamment du paramètre <code>useCapture</code>.</p> </div> -<div class="note"> -<p><strong>Note :</strong> <em><code>useCapture</code></em> n'est pas toujours facultatif. Idéalement, vous devriez l'inclure pour une compatibilité de navigateurs la plus large possible.</p> +<div class="notecard note"> + <p><strong>Note :</strong> <code>useCapture</code> n'a pas toujours été facultatif. Idéalement, vous devriez l'inclure pour une compatibilité navigateur la plus large possible.</p> </div> <dl> - <dt><em><code>veutNonFiables</code></em> {{Non-standard_inline}}</dt> - <dd>Un paramètre spécifique à Firefox (Gecko). Si <code>true</code>, l'écouteur reçoit les événements synthétiques distribués par le contenu web (le défaut est <code>false</code> pour le {{glossary("chrome")}} du navigateur et <code>true</code> pour les pages web ordinaires). Ce paramètre est utile pour le code qui se trouve dans les compléments, ainsi que pour le navigateur lui-même.</dd> + <dt><code>wantsUntrusted</code> {{Non-standard_inline}}</dt> + <dd>Un paramètre spécifique à Firefox (Gecko). Si <code>true</code>, l'écouteur reçoit les évènements synthétiques distribués par le contenu web (le défaut est <code>false</code> pour le {{glossary("chrome")}} du navigateur et <code>true</code> pour les pages web ordinaires). Ce paramètre est utile pour le code qui se trouve dans les compléments, ainsi que pour le navigateur lui-même.</dd> </dl> -<h3 id="Valeur_retournée">Valeur retournée</h3> +<h3 id="Return_value">Valeur de retour</h3> <p><code>undefined</code></p> -<h2 id="Notes_dutilisation">Notes d'utilisation</h2> +<h2 id="Usage_notes">Notes d'utilisation</h2> -<h3 id="Le_rappel_de_lécouteur_dévènement">Le rappel de l'écouteur d'évènement</h3> +<h3 id="The_event_listener_callback">Utilisation d'une fonction de rappel (<i>callback</i>)</h3> -<p>L'écouteur d'évènement peut être spécifié, soit comme une fonction de rappel, soit comme un objet qui implémente {{domxref ("EventListener")}}, dont la méthode {{domxref ("EventListener.handleEvent", "handleEvent ()")}} sert de fonction de rappel.</p> +<p>L'écouteur d'évènement peut être spécifié, soit comme une fonction de rappel (<i>callback</i>), soit comme un objet qui implémente {{domxref("EventListener")}} dont la méthode {{domxref("EventListener.handleEvent", "handleEvent()")}} sert de fonction de rappel.</p> -<p>La fonction de rappel a elle-même les mêmes paramètres et la même valeur de retour que la méthode <code>handleEvent()</code> ; c'est-à-dire que le rappel accepte un seul paramètre : un objet basé sur {{domxref ("Event")}} décrivant l'événement qui s'est produit, et il ne retourne rien.</p> +<p>La fonction de rappel reçoit les mêmes paramètres et fournit la même valeur de retour que la méthode <code>handleEvent()</code> ; c'est-à-dire que le rappel accepte un seul paramètre : un objet basé sur {{domxref("Event")}} décrivant l'évènement qui s'est produit, et il ne retourne rien.</p> -<p>Par exemple, un rappel de gestionnaire d'événements pouvant être utilisé pour gérer à la fois {{domxref("Element/fullscreenchange_event", "fullscreenchange")}} et {{domxref("Element/fullscreenerror_event", "fullscreenerror")}} peut ressembler à ceci :</p> +<p>Par exemple, un rappel de gestionnaire d'évènements pouvant être utilisé pour gérer à la fois {{domxref("Element/fullscreenchange_event", "fullscreenchange")}} et {{domxref("Element/fullscreenerror_event", "fullscreenerror")}} peut ressembler à ceci :</p> -<pre class="brush: js line-numbers language-js notranslate">function gestionnaireDEvenement(evenement) { - if (evenement.type == fullscreenchange) { +<pre class="brush: js"> +function eventHandler(event) { + if (event.type == 'fullscreenchange') { /* gérer un passage en plein écran */ } else /* fullscreenerror */ { /* gérer une erreur de passage en plein écran */ } -}</pre> +} +</pre> -<h3 id="Détection_de_la_prise_en_charge_des_options_en_toute_sécurité">Détection de la prise en charge des options en toute sécurité</h3> +<h3 id="Safely_detecting_option_support">Détection la prise en charge d'<code>options</code></h3> -<p>Dans les anciennes versions de la spécification DOM, le troisième paramètre de <code>addEventListener()</code> était une valeur booléenne indiquant s'il fallait ou non utiliser la capture. Au fil du temps, il est devenu clair que davantage d'options étaient nécessaires. Plutôt que d'ajouter davantage de paramètres à la fonction (ce qui complique énormément les choses lors du traitement des valeurs optionnelles), le troisième paramètre a été changé en un objet pouvant contenir diverses propriétés définissant les valeurs des options pour configurer le processus de suppression de l'écouteur d'événement.</p> +<p>Dans les anciennes versions de la spécification DOM, le troisième paramètre de <code>addEventListener()</code> était une valeur booléenne indiquant s'il fallait ou non utiliser la capture. Au fil du temps, il est devenu clair que davantage d'options étaient nécessaires. Plutôt que d'ajouter davantage de paramètres à la fonction (ce qui complique énormément les choses lors du traitement des valeurs optionnelles), le troisième paramètre a été changé en un objet pouvant contenir diverses propriétés définissant les valeurs des options pour configurer le processus de suppression de l'écouteur d'évènement.</p> -<p>Du fait que les navigateurs anciens (ainsi que certains navigateurs "pas si vieux") supposent toujours que le troisième paramètre est un Boolean, vous devez construire votre code de façon à gérer ce scénario intelligemment. Vous pouvez le faire en utilisant la détection de fonctionnalité pour chacune des options qui vous intéresse.</p> +<p>Du fait que les navigateurs anciens supposent toujours que le troisième paramètre est un booléen, vous devez construire votre code de façon à gérer ce scénario intelligemment. Vous pouvez le faire en utilisant la détection de fonctionnalité pour chacune des options qui vous intéresse.</p> <p>Par exemple, si vous voulez vérifier l'option <code>passive</code> :</p> -<pre class="brush: js line-numbers language-js notranslate">var passiveSupportee = false; +<pre class="brush: js"> +let passiveSupported = false; try { - var options = Object.defineProperty({}, "passive", { + let options = Object.defineProperty({}, "passive", { get: function() { - passiveSupportee = true; + passiveSupported = true; } }); - window.addEventListener("test", options, options); - window.removeEventListener("test", options, options); + window.addEventListener("test", null, options); + window.removeEventListener("test", null, options); } catch(err) { - passiveSupportee = false; -}</pre> + passiveSupported = false; +} +</pre> -<p>Cela crée un objet <em><code>options</code></em> avec une fonction accesseur pour la propriété <code>passive</code> ; l'accesseur initialise un indicateur, <code>passiveSupportee</code>, à <code>true</code> si elle est appelée. Cela signifie que si le navigateur vérifie la valeur de la propriété <code>passive</code> dans l'objet <em><code>options</code></em>, <code>passiveSupportee</code> sera initialisé à <code>true</code> ; sinon, il restera <code>false</code>. Nous appelons alors <code>addEventListener()</code> pour installer un faux gestionnaire d'événements, en spécifiant ces options, se sorte qu'elles soient vérifiées si le navigateur reconnaît un objet comme troisième paramètre. Ensuite, nous appelons <code>removeEventListener()</code> pour faire le ménage après notre passage. (Notez que <code>handleEvent()</code> est ignoré dans les écouteurs d'événements qui ne sont pas appelés).</p> +<p>Cela crée un objet <code>options</code> avec une fonction accesseur pour la propriété <code>passive</code> ; l'accesseur initialise un indicateur, <code>passiveSupported</code>, à <code>true</code> si elle est appelée. Cela signifie que si le navigateur vérifie la valeur de la propriété <code>passive</code> dans l'objet <code>options</code>, <code>passiveSupported</code> sera initialisé à <code>true</code> ; sinon, il restera <code>false</code>. Nous appelons alors <code>addEventListener()</code> pour installer un faux gestionnaire d'évènements, en spécifiant ces options, se sorte qu'elles soient vérifiées si le navigateur reconnaît un objet comme troisième paramètre. Ensuite, nous appelons <code>removeEventListener()</code> pour faire le ménage après notre passage. (Notez que <code>handleEvent()</code> est ignoré dans les écouteurs d'évènements qui ne sont pas appelés).</p> <p>Vous pouvez vérifier de cette façon si une option quelconque est supportée. Ajoutez simplement un accesseur pour cette option en utilisant un code similaire à celui montré ci-dessus.</p> -<p>Ensuite, lorsque vous voulez créer un écouteur d'événements réel qui utilise les options en question, vous pouvez faire quelque chose comme ce qui suit :</p> +<p>Ensuite, lorsque vous voulez créer un écouteur d'évènements réel qui utilise les options en question, vous pouvez faire quelque chose comme ce qui suit :</p> -<pre class="brush: js line-numbers language-js notranslate">unElement.addEventListener("mouseup", gererMouseUp, passiveSupportee - ? { passive: true } : false);</pre> +<pre class="brush: js"> +someElement.addEventListener( + "mouseup", + handleMouseUp, + passiveSupported ? { passive: true } : false +); +</pre> -<p>Ici, nous ajoutons un écouteur pour l'événement {{domxref("Element/mouseup_event", "mouseup")}} dans l'élément <em><code>unElement</code></em>. Pour le troisième paramètre, si <em><code>passiveSupportee</code></em> est <code>true</code>, nous spécifions un objet <em><code>options</code></em> avec <code>passive</code> initialisée à <code>true</code> ; sinon, nous savons que nous devons passer un Boolean, et nous passons <code>false</code> comme valeur du paramètre <em><code>useCapture</code></em>.</p> +<p>Ici, nous ajoutons un écouteur pour l'évènement {{domxref("Element/mouseup_event", "mouseup")}} dans l'élément <code>someElement</code>. Pour le troisième paramètre, si <code>passiveSupported</code> est <code>true</code>, nous spécifions un objet <code>options</code> avec <code>passive</code> initialisée à <code>true</code> ; sinon, nous savons que nous devons passer un Boolean, et nous passons <code>false</code> comme valeur du paramètre <code>useCapture</code>.</p> -<p>Si vous préférez, vous pouvez utiliser une bibliothèque tierce comme <a href="https://modernizr.com/docs">Modernizr</a> ou <a href="https://github.com/rafrex/detect-it">Detect It</a> pour faire ce test pour vous.</p> +<p>Si vous préférez, vous pouvez utiliser une bibliothèque tierce comme <a href="https://github.com/modernizr/modernizr">Modernizr</a> ou <a href="https://github.com/rafrex/detect-it">Detect It</a> pour faire ce test pour vous.</p> -<p>Vous pouvez en apprendre davantage dans l'article à propos des <code><a href="https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md#feature-detection">EventListenerOptions</a></code> du <a href="https://wicg.github.io/admin/charter.html">Groupe Web Incubator Community</a>.</p> +<p>Vous pouvez en apprendre davantage dans l'article à propos des <code><a href="https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md#feature-detection">EventListenerOptions</a></code> du <a href="https://wicg.github.io/admin/charter.html">Groupe Web Incubator Community</a>.</p> -<h2 id="Exemples">Exemples</h2> +<h2 id="Examples">Exemples</h2> -<h3 id="Ajouter_un_écouteur_simple">Ajouter un écouteur simple</h3> +<h3 id="Add_a_simple_listener">Ajouter un écouteur simple</h3> <p>Cet exemple montre comment utiliser <code>addEventListener()</code> pour surveiller les clics de souris sur un élément.</p> <h4 id="HTML">HTML</h4> -<pre class="brush: html line-numbers language-html notranslate"><table id="aLExterieur"> - <tr><td id="t1">un</td></tr> - <tr><td id="t2">deux</td></tr> -</table></pre> +<pre class="brush: html"> +<table id="outside"> + <tr><td id="t1">un</td></tr> + <tr><td id="t2">deux</td></tr> +</table> +</pre> <h4 id="JavaScript">JavaScript</h4> -<pre class="brush: js line-numbers language-js notranslate">// Fonction pour changer le contenu de t2 -function modifierTexte() { - var t2 = document.getElementById("t2"); +<pre class="brush: js"> +// Fonction pour changer le contenu de t2 +function modifyText() { + const t2 = document.querySelector("#t2"); if (t2.firstChild.nodeValue == "trois") { t2.firstChild.nodeValue = "deux"; } else { @@ -152,87 +177,98 @@ function modifierTexte() { } // Ajouter un écouteur d'évènements à la table -var el = document.getElementById("aLExterieur"); -el.addEventListener("click", modifierTexte, false);</pre> +const el = document.querySelector("#outside"); +el.addEventListener("click", modifyText, false); +</pre> -<p>Dans ce code, <code>modifierTexte()</code> est un écouteur pour les évènements <code>click</code> enregistré en utilisant <code>addEventListener()</code>. Un clic n'importe où sur la table se propagera jusqu'au gestionnaire et exécutera <code>modifierTexte()</code>.</p> +<p>Dans ce code, <code>modifyText()</code> est un écouteur pour les évènements <code>click</code> enregistré en utilisant <code>addEventListener()</code>. Un clic n'importe où sur la table se propagera jusqu'au gestionnaire et exécutera <code>modifyText()</code>.</p> -<h4 id="Résultat">Résultat</h4> +<h4 id="Result">Résultat</h4> <p>{{EmbedLiveSample('Add_a_simple_listener')}}</p> -<h3 id="Écouteur_dévènement_avec_une_fonction_anonyme">Écouteur d'évènement avec une fonction anonyme</h3> +<h3 id="Event_listener_with_anonymous_function">Écouteur d'évènement avec une fonction anonyme</h3> -<p>Ici, nous allons voir comment utiliser une fonction anonyme pour passer des paramètres à l'écouteur d'événements.</p> +<p>Ici, nous allons voir comment utiliser une fonction anonyme pour passer des paramètres à l'écouteur d'évènements.</p> <h4 id="HTML_2">HTML</h4> -<pre class="brush: html line-numbers language-html notranslate"><table id="aLExterieur"> - <tr><td id="t1">un</td></tr> - <tr><td id="t2">deux</td></tr> -</table></pre> +<pre class="brush: html"> +<table id="outside"> + <tr><td id="t1">un</td></tr> + <tr><td id="t2">deux</td></tr> +</table> +</pre> <h4 id="JavaScript_2">JavaScript</h4> -<pre class="brush: js line-numbers language-js notranslate">// Fonction pour changer le contenu de t2 -function modifierTexte(nouveau_texte) { - var t2 = document.getElementById("t2"); - t2.firstChild.nodeValue = nouveau_texte; +<pre class="brush: js"> +// Fonction pour changer le contenu de t2 +function modifyText(newText) { + const t2 = document.querySelector("#t2"); + t2.firstChild.nodeValue = newText; } // Fonction pour ajouter un écouteur d'évènement à la table -var el = document.getElementById("aLExterieur"); -el.addEventListener("click", function(){modifierTexte("quatre")}, false);</pre> +const el = document.querySelector("#outside"); +el.addEventListener("click", function(){modifyText("quatre")}, false); +</pre> -<p>Notez que l'écouteur est une fonction anonyme encapsulant le code qui peut à son tour envoyer des paramètres à la fonction <code>modifierTexte()</code>, qui est responsable de la réponse effective à l'événement.</p> +<p>Notez que l'écouteur est une fonction anonyme encapsulant le code qui peut à son tour envoyer des paramètres à la fonction <code>modifyText()</code>, qui est responsable de la réponse effective à l'évènement.</p> -<h4 id="Résultat_2">Résultat</h4> +<h4 id="Result_2">Résultat</h4> <p>{{EmbedLiveSample('Event_listener_with_anonymous_function')}}</p> -<h3 id="Écouteur_dévènement_avec_une_fonction_fléchée">Écouteur d'évènement avec une fonction fléchée</h3> +<h3 id="Event_listener_with_an_arrow_function">Écouteur d'évènement avec une fonction fléchée</h3> -<p>Cet exemple montre un écouteur d'événement simple implémenté en utilisant la notation de fonction fléchée.</p> +<p>Cet exemple montre un écouteur d'évènement simple implémenté en utilisant la notation de fonction fléchée.</p> <h4 id="HTML_3">HTML</h4> -<pre class="brush: html line-numbers language-html notranslate"><table id="aLExterieur"> - <tr><td id="t1">un</td></tr> - <tr><td id="t2">deux</td></tr> -</table></pre> +<pre class="brush: html"> +<table id="outside"> + <tr><td id="t1">un</td></tr> + <tr><td id="t2">deux</td></tr> +</table> +</pre> <h4 id="JavaScript_3">JavaScript</h4> -<pre class="brush: js line-numbers language-js notranslate">// Fonction pour changer le contenu de t2 -function modifierTexte(nouveau_texte) { - var t2 = document.getElementById("t2"); - t2.firstChild.nodeValue = nouveau_texte; +<pre class="brush: js"> +// Fonction pour changer le contenu de t2 +function modifyText(newText) { + const t2 = document.querySelector("#t2"); + t2.firstChild.nodeValue = newText; } // Ajouter un écouteur d'évènements à la table avec une fonction fléchée -var el = document.getElementById("aLExterieur"); -el.addEventListener("click", () => { modifierTexte("quatre"); }, false);</pre> +const el = document.querySelector("#outside"); +el.addEventListener("click", () => { + modifyText("quatre"); +}, false);</pre> -<h4 id="Résultat_3">Résultat</h4> +<h4 id="Result_3">Résultat</h4> <p>{{EmbedLiveSample('Event_listener_with_an_arrow_function')}}</p> -<p>Notez que si les fonctions anonymes et fléchées sont similaires, elles ont des liaisons <code>this</code> différentes. Alors que les fonctions anonymes (et toutes les fonctions JavaScript traditionnelles) créent leurs propres liaisons <code>this</code>, les fonctions fléchées héritent la liaison<code> this</code> de la fonction contenante.</p> +<p>Notez que si les fonctions anonymes et fléchées sont similaires, elles ont des liaisons <code>this</code> différentes. Alors que les fonctions anonymes (et toutes les fonctions JavaScript traditionnelles) créent leurs propres liaisons <code>this</code>, les fonctions fléchées héritent la liaison <code>this</code> de la fonction contenante. <a href="fr/docs/Web/JavaScript/Reference/Operators/this#avec_les_fonctions_fléchées">Voir la page sur l'opérateur <code>this</code> pour plus d'informations.</a></p> <p>Cela signifie que les variables et constantes disponibles pour la fonction contenante sont aussi disponibles pour le gestionnaire d'évènements lors de l'utilisation d'une fonction fléchée.</p> -<h3 id="Exemple_dutilisation_des_options">Exemple d'utilisation des options</h3> +<h3 id="Example_of_options_usage">Exemple d'utilisation des options</h3> <h4 id="HTML_4">HTML</h4> -<pre class="brush: html notranslate"><div class="exterieur"> +<pre class="brush: html"> +<div class="outer"> extérieur, once & none-once - <div class="milieu" target="_blank"> + <div class="middle" target="_blank"> milieu, capture & none-capture - <a class="interieur1" href="https://www.mozilla.org" target="_blank"> + <a class="inner1" href="https://www.mozilla.org" target="_blank"> intérieur1, passive & preventDefault (ce qui n'est pas autorisé) </a> - <a class="interieur2" href="https://developer.mozilla.org/" target="_blank"> + <a class="inner2" href="https://developer.mozilla.org/" target="_blank"> intérieur2, none-passive & preventDefault (nouvelle page non ouverte) </a> </div> @@ -241,185 +277,242 @@ el.addEventListener("click", () => { modifierTexte("quatre"); }, false);</pre <h4 id="CSS">CSS</h4> -<pre class="brush: css notranslate">.exterieur, .milieu, .interieur1, .interieur2 { +<pre class="brush: css"> +.outer, +.middle, +.inner1, +.inner2 { display: block; - width: 520px; + width: 520px; padding: 15px; - margin: 15px; + margin: 15px; text-decoration: none; } -.exterieur { +.outer { border: 1px solid red; - color: red; + color: red; } -.milieu { +.middle { border: 1px solid green; - color: green; - width: 460px; + color: green; + width: 460px; } -.interieur1, .interieur2 { +.inner1, +.inner2 { border: 1px solid purple; - color: purple; - width: 400px; + color: purple; + width: 400px; } </pre> <h4 id="JavaScript_4">JavaScript</h4> -<pre class="brush: js notranslate">const exterieur = document.querySelector('.exterieur'); -const milieu = document.querySelector('.milieu'); -const interieur1 = document.querySelector('.interieur1'); -const interieur2 = document.querySelector('.interieur2'); +<pre class="brush: js"> +const outer = document.querySelector('.outer'); +const middle = document.querySelector('.middle'); +const inner1 = document.querySelector('.inner1'); +const inner2 = document.querySelector('.inner2'); const capture = { - capture : true + capture: true }; const noneCapture = { - capture : false + capture: false }; const once = { - once : true + once: true }; const noneOnce = { - once : false + once: false }; const passive = { - passive : true + passive: true }; const nonePassive = { - passive : false + passive: false }; -exterieur .addEventListener('click', onceHandler, once); -exterieur .addEventListener('click', noneOnceHandler, noneOnce); -milieu .addEventListener('click', captureHandler, capture); -milieu .addEventListener('click', noneCaptureHandler, noneCapture); -interieur1.addEventListener('click', passiveHandler, passive); -interieur2.addEventListener('click', nonePassiveHandler, nonePassive); +outer.addEventListener('click', onceHandler, once); +outer.addEventListener('click', noneOnceHandler, noneOnce); +middle.addEventListener('click', captureHandler, capture); +middle.addEventListener('click', noneCaptureHandler, noneCapture); +inner1.addEventListener('click', passiveHandler, passive); +inner2.addEventListener('click', nonePassiveHandler, nonePassive); -function onceHandler(evenement) { - alert('exterieur, once'); +function onceHandler(event) { + console.log('extérieur, once'); } -function noneOnceHandler(evenement) { - alert('exterieur, none-once, default'); +function noneOnceHandler(event) { + console.log('extérieur, none-once, default'); } -function captureHandler(evenement) { - //evenement.stopImmediatePropagation(); - alert('milieu, capture'); +function captureHandler(event) { + // event.stopImmediatePropagation(); + console.log('milieur, capture'); } -function noneCaptureHandler(evenement) { - alert('milieu, none-capture, default'); +function noneCaptureHandler(event) { + console.log('milieur, none-capture, default'); } -function passiveHandler(evenement) { +function passiveHandler(event) { // Impossible d'utiliser preventDefault à l'intérieur de l'invocation d'un écouteur d'évènements passif. - evenement.preventDefault(); - alert('interieur1, passive, nouvelle page ouverte'); + event.preventDefault(); + console.log('intérieur1, passive, nouvelle page ouverte'); } -function nonePassiveHandler(evenement) { - evenement.preventDefault(); - //evenement.stopPropagation(); - alert('interieur2, none-passive, défaut, nouvelle page non ouverte'); +function nonePassiveHandler(event) { + event.preventDefault(); + // event.stopPropagation(); + console.log('intérieur2, none-passive, default, nouvelle page non ouverte'); } </pre> -<h4 id="Résultat_4">Résultat</h4> +<h4 id="Result_4">Résultat</h4> + +<p>Cliquez les conteneurs <var>extérieur</var>, <var>milieu</var>, <var>intérieurs</var> respectivement pour voir comment les options fonctionnent. Vous pouvez ouvrir la console pour observer les différents messages émis.</p> + +<p>{{EmbedLiveSample('Example_of_options_usage', '', '320')}}</p> + +<p>Avant d'utiliser une valeur particulière dans l'objet <code>options</code>, c'est une bonne idée que de s'assurer que le navigateur de l'utilisateur la prend en charge, du fait qu'elles sont un ajout que tous les navigateurs n'ont pas pris en charge historiquement. Voir {{anch("Safely_detecting_option_support", "Détection sûre du support des options")}} pour les détails.</p> + +<h3 id="Add_a_abortable_listener">Ajout d'un écouteur annulable</h3> + +<p>Cet exemple montre comment ajouter un <code>addEventListener()</code> qui peut être interrompu par un {{domxref("AbortSignal")}}.</p> + +<h4 id="HTML_5">HTML</h4> + +<pre class="brush: html"> +<table id="outside"> + <tr><td id="t1">un</td></tr> + <tr><td id="t2">deux</td></tr> +</table> +</pre> + +<h4 id="JavaScript_5">JavaScript</h4> + +<pre class="brush: js"> +// Ajout d'un écouteur d'évènement annulable à la table +const controller = new AbortController(); +const el = document.querySelector("#outside"); +el.addEventListener("click", modifyText, { signal: controller.signal }); -<p>Cliquer les conteneurs extérieur, milieu, intérieurs respectivement pour voir comment les options fonctionnent.</p> +// Fonction permettant de modifier le contenu de t2 +function modifyText() { + const t2 = document.querySelector("#t2"); + if (t2.firstChild.nodeValue == "trois") { + t2.firstChild.nodeValue = "deux"; + } else { + t2.firstChild.nodeValue = "trois"; + controller.abort(); // supprime l'écouteur lorsque la valeur est "trois". + } +} +</pre> + +<p>Dans l'exemple ci-dessus, nous modifions le code de l'exemple {{anch('Add_a_simple_listener', 'Ajouter un écouteur simple')}} de telle sorte qu'après que le contenu de la deuxième ligne soit devenu « trois », nous appelons <code>abort()</code> à partir du {{domxref("AbortController")}} que nous avons passé à l'appel <code>addEventListener()</code>. Cela a pour résultat que la valeur reste à "trois" pour toujours, parce que nous n'avons plus de code écoutant un évènement de clic.</p> -<p>{{ EmbedLiveSample('Example_of_options_usage', 600, 310, '', 'Web/API/EventTarget/addEventListener') }}</p> +<h4 id="Result_5">Résultat</h4> -<p>Avant d'utiliser une valeur particulière dans l'objet <code><var>options</var></code>, c'est une bonne idée que de s'assurer que le navigateur de l'utilisateur la prend en charge, du fait qu'elles sont un ajout que tous les navigateurs n'ont pas pris en charge historiquement. Voir {{anch("Safely detecting option support")}} pour les détails.</p> +<p>{{EmbedLiveSample('Add_a_abortable_listener')}}</p> -<h2 id="Autres_notes">Autres notes</h2> +<h2 id="Other_notes">Autres notes</h2> -<h3 id="Pourquoi_utiliser_addEventListener">Pourquoi utiliser addEventListener() ?</h3> +<h3 id="Why_use_addEventListener">Pourquoi utiliser addEventListener() ?</h3> <p><code>addEventListener</code> est la manière d'enregistrer un écouteur d'évènements telle que spécifiée dans le DOM du W3C. Ses avantages sont les suivants :</p> <ul> - <li>Elle permet d'ajouter plus d'un seul gestionnaire pour un évènement. Cela peut s'avérer particulièrement utile pour les bibliothèques {{Glossary("AJAX")}}, les modules JavaScript ou tout autre sorte de code qui a besoin de fonctionner correctement avec d'autres bibliothèques/extensions.</li> - <li>Elle donne un contrôle plus fin sur la phase d'activation de l'écouteur (capture contre propagation)</li> - <li>Elle fonctionne avec tout élément DOM, pas seulement avec les éléments HTML.</li> + <li>Elle permet d'ajouter plus d'un seul gestionnaire pour un évènement. Cela peut s'avérer particulièrement utile pour les bibliothèques {{Glossary("AJAX")}}, les modules JavaScript ou tout autre sorte de code qui a besoin de fonctionner correctement avec d'autres bibliothèques/extensions.</li> + <li>Elle donne un contrôle plus fin sur la phase d'activation de l'écouteur (capture contre propagation)</li> + <li>Elle fonctionne avec tout élément DOM, pas seulement avec les éléments HTML.</li> </ul> -<p>L'<a href="https://wiki.developer.mozilla.org/fr/docs/Web/API/EventTarget/addEventListener$edit#Older_way_to_register_event_listeners">ancienne manière alternative</a> d'enregistrer des évènements est décrite ci-dessous.</p> +<p>L'<a href="#older_way_to_register_event_listeners">ancienne manière alternative</a> d'enregistrer des évènements est décrite ci-dessous.</p> -<h3 id="Ajout_dun_écouteur_pendant_la_distribution_dun_évènement">Ajout d'un écouteur pendant la distribution d'un évènement</h3> +<h3 id="Adding_a_listener_during_event_dispatch">Ajout d'un écouteur pendant la distribution d'un évènement</h3> <p>Si un {{domxref("EventListener")}} est ajouté à une {{domxref("EventTarget")}} pendant qu'elle traite un évènement, cet évènement ne déclenchera l'écouteur. Cependant, le même écouteur pourra être déclenché à une étape ultérieure du flux d'évènements, telle que la phase de propagation.</p> -<h3 id="Écouteurs_dévènements_identiques_multiples">Écouteurs d'évènements identiques multiples</h3> +<h3 id="Multiple_identical_event_listeners">Écouteurs d'évènements identiques multiples</h3> -<p>Si des <code>EventListener</code>s identiques multiples sont enregistrés sur la même <code>EventTarget</code> avec les mêmes paramètres, les instances dupliquées sont supprimées. Elles ne provoqueront pas un appel en double de l'<code>EventListener</code>, et elles n'ont pas besoin d'être enlevées avec la méthode {{domxref("EventTarget.removeEventListener()", "removeEventListener()")}}.</p> +<p>Si des <code>EventListener</code> identiques multiples sont enregistrés sur la même <code>EventTarget</code> avec les mêmes paramètres, les instances dupliquées sont supprimées. Elles ne provoqueront pas un appel en double de l'<code>EventListener</code>, et elles n'ont pas besoin d'être enlevées avec la méthode {{domxref("EventTarget.removeEventListener()", "removeEventListener()")}}.</p> <p>Notez toutefois que lors de l'utilisation d'une fonction anonyme comme gestionnaire, de tels écouteurs ne seront PAS identiques, du fait que les fonctions anonymes ne sont pas identiques, même si définies en utilisant le MÊME code source inchangé, simplement appelé répétitivement, même dans une boucle.</p> -<p>Cependant, le fait de définir répétitivement la même fonction nommée dans de tels cas peut être davantage problématique. (Voir <a href="https://wiki.developer.mozilla.org/fr/docs/Web/API/EventTarget/addEventListener$edit#Memory_issues">Problèmes de mémoire</a> ci-dessous.)</p> +<p>Cependant, le fait de définir répétitivement la même fonction nommée dans de tels cas peut être davantage problématique. (Voir <a href="#memory_issues">Problèmes de mémoire</a> ci-dessous.)</p> -<h3 id="La_valeur_de_this_à_lintérieur_du_gestionnaire">La valeur de "this" à l'intérieur du gestionnaire</h3> +<h3 id="The_value_of_this_within_the_handler">La valeur de "this" à l'intérieur du gestionnaire</h3> <p>Il est souvent souhaitable de référencer l'élément sur lequel le gestionnaire d'évènements a été déclenché, comme lors de l'utilisation d'un gestionnaire générique pour un ensemble d'éléments similaires.</p> <p>Lorsqu'une fonction gestionnaire est attachée à un élément en utilisant <code>addEventListener()</code>, la valeur de {{jsxref("Operators/this","this")}} à l'intérieur du gestionnaire est une référence à l'élément. C'est la même valeur que celle de la propriété <code>currentTarget</code> de l'argument évènement qui est passé au gestionnaire.</p> -<pre class="brush: js notranslate">mon_element.addEventListener('click', function (e) { - console.log(this.className) // journalise le className de mon_element +<pre class="brush: js"> +my_element.addEventListener('click', function(e) { + console.log(this.className) // journalise le className de my_element console.log(e.currentTarget === this) // journalise `true` }) </pre> -<p>Pour mémoire, les <a href="https://wiki.developer.mozilla.org/fr-FR/docs/Web/JavaScript/Reference/Functions/Arrow_functions#No_separate_this">fonctions fléchées n'ont pas leur propre contexte <code>this</code></a>.</p> +<p>Pour mémoire, les <a href="/fr/docs/Web/JavaScript/Reference/Functions/Arrow_functions#pas_de_this_lié_à_la_fonction">fonctions fléchées n'ont pas de <code>this</code> lié</a>.</p> -<pre class="brush: js notranslate">mon_element.addEventListener('click', (e) => { - console.log(this.className) // ATTENTION : `this` n'est pas `mon_element` +<pre class="brush: js"> +my_element.addEventListener('click', (e) => { + console.log(this.className) // ATTENTION : `this` n'est pas `my_element` console.log(e.currentTarget === this) // journalise `false` -})</pre> +}) +</pre> -<p>Si un attribut d'évènement (par exemple, {{domxref("GlobalEventHandlers.onclick", "onclick")}}) est spécifié dans un élément dans le source HTML, le code JavaScript dans la valeur de l'attribut est effectivement encapsulé dans une fonction gestionnaire qui lie la valeur de <code>this</code> d'une manière cohérente avec l'<code>addEventListener()</code> ; une occurrence de <code>this</code> dans le code représente une référence à l'élément.</p> +<p>Si un gestionnaire d'évènements (par exemple, {{domxref("GlobalEventHandlers.onclick", "onclick")}}) est spécifié sur un élément dans la source HTML, le code JavaScript dans la valeur de l'attribut est effectivement encapsulé dans une fonction du gestionnaire qui lie la valeur de <code>this</code> d'une manière cohérente avec le <code>addEventListener()</code> ; une occurrence de <code>this</code> dans le code représente une référence à l'élément.</p> -<pre class="brush: html notranslate"><table id="ma_table" onclick="console.log(this.id);"><!-- `this` fait référence à la table ; journalise 'ma_table' --> +<pre class="brush: html"> +<table id="my_table" onclick="console.log(this.id);"> +<!-- `this` fait référence à la table ; journalise 'my_table' --> ... -</table></pre> +</table> +</pre> -<p>Notez que la valeur de <code>this</code> à l'intérieur d'une fonction, <em>appelée</em> par le code dans la valeur de l'attribut, se comporte selon les <a href="https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/L_op%C3%A9rateur_this">règles standard</a>. Ceci est illustré dans l'exemple suivant :</p> +<p>Notez que la valeur de <code>this</code> à l'intérieur d'une fonction, appelée par le code dans la valeur de l'attribut, se comporte selon les <a href="/fr/docs/Web/JavaScript/Reference/Operators/this">règles standard</a>. Ceci est illustré dans l'exemple suivant :</p> -<pre class="brush: html notranslate"><script> - function journaliserID() { console.log(this.id); } +<pre class="brush: html"> +<script> + function logID() { console.log(this.id); } </script> -<table id="ma_table" onclick="journaliserID();"><!-- lorsqu'appelée, `this` fera référence à l'objet global --> +<table id="my_table" onclick="logID();"> +<!-- lorsqu'appelée, `this` fera référence à l'objet global --> ... -</table></pre> +</table> +</pre> -<p>La valeur de <code>this</code> à l'intérieur de <code>journaliserID</code> est une référence à l'objet global {{domxref("Window")}} (ou <code>undefined</code> dans le cas du <a href="https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Strict_mode">mode strict</a>).</p> +<p>La valeur de <code>this</code> à l'intérieur de <code>logID</code> est une référence à l'objet global {{domxref("Window")}} (ou <code>undefined</code> dans le cas du <a href="/fr/docs/Web/JavaScript/Reference/Strict_mode">mode strict</a>).</p> -<h4 id="Spécification_de_this_en_utilisant_bind">Spécification de "this" en utilisant bind()</h4> +<h4 id="Specifying_this_using_bind">Spécification de "this" en utilisant bind()</h4> <p>La méthode {{jsxref("Function.prototype.bind()")}} vous permet de spécifier la valeur qui doit être utilisée comme <code>this</code> pour tous les appels à une fonction donnée. Cette méthode vous permet de contourner facilement les problèmes dans lesquels ce que <code>this</code> sera n'est pas clair, en fonction du contexte depuis lequel votre fonction a été appelée. Notez toutefois que vous aurez besoin de conserver quelque part une référence à l'écouteur, de façon à pouvoir le supprimer ultérieurement.</p> <p>Ceci est un exemple avec et sans <code>bind()</code> :</p> -<pre class="brush: js line-numbers language-js notranslate">var QuelqueChose = function(element) { +<pre class="brush: js"> +const Something = function(element) { // |this| est un objet nouvellement créé - this.name = 'Quelque Chose de Bon'; - this.onclick1 = function(evenement) { - console.log(this.name); // undefined, du fait que |this| est l'élément + this.name = 'Quelque chose de bon'; + this.onclick1 = function(event) { + console.log(this.name); // undefined, car |this| est l'élément }; - this.onclick2 = function(evenement) { - console.log(this.name); // 'Quelque Chose de Bon', du fait que |this| est lié à l'objet nouvellement créé + this.onclick2 = function(event) { + console.log(this.name); // 'Quelque chose de bon', car |this| est lié à l'objet nouvellement créé }; element.addEventListener('click', this.onclick1, false); element.addEventListener('click', this.onclick2.bind(this), false); // Astuce } -var q = new QuelqueChose(document.body);</pre> +const s = new Something(document.body); +</pre> <p>Une autre solution consiste à utiliser une fonction spéciale appelée <code>handleEvent()</code> to intercepter tous les évènements :</p> -<pre class="brush: js notranslate">const QuelqueChose = function(element) { +<pre class="brush: js"> +const Something = function(element) { // |this| est un objet nouvellement créé - this.name = 'Quelque Chose de Bon'; - this.<code>handleEvent</code> = function(evenement) { - console.log(this.name); // 'Quelque Chose de Bon', du fait que this est lié à l'objet nouvellement créé - switch(evenement.type) { + this.name = 'Quelque chose de bon'; + this.handleEvent = function(event) { + console.log(this.name); // "Quelque chose de bon", car |this| est lié à l'objet nouvellement créé. + switch(event.type) { case 'click': // un peu de code ici... break; @@ -429,31 +522,32 @@ var q = new QuelqueChose(document.body);</pre> } }; - // Notez que les écouteurs dans ce cas sont |this|, pas this.<code>handleEvent</code> + // Notez que les écouteurs dans ce cas sont |this|, et non this.handleEvent element.addEventListener('click', this, false); element.addEventListener('dblclick', this, false); - // Vous pouvez enlever correctement les écouteurs + // Vous pouvez retirer correctement les écouteurs element.removeEventListener('click', this, false); element.removeEventListener('dblclick', this, false); } -const q = new QuelqueChose(document.body); +const s = new Something(document.body); </pre> -<p>Une autre manière de gérer la référence à <em>this</em> est de passer à l'<code>EventListener</code> une fonction qui appelle la méthode de l'objet qui contient les champs auxquels on a besoin d'accéder :</p> +<p>Une autre manière de gérer la référence à this est de passer à l'<code>EventListener</code> une fonction qui appelle la méthode de l'objet qui contient les champs auxquels on a besoin d'accéder :</p> -<pre class="brush: js notranslate">class UneClasse { +<pre class="brush: js"> +class SomeClass { constructor() { - this.name = 'Quelque Chose de Bon'; + this.name = 'Quelque chose de bon'; } - enregistrer() { - const cela = this; - window.addEventListener('keydown', function(e) { cela.uneMethode(e); }); + register() { + const that = this; + window.addEventListener('keydown', function(e) { that.someMethod(e); }); } - uneMethode(e) { + someMethod(e) { console.log(this.name); switch(e.keyCode) { case 5: @@ -467,107 +561,114 @@ const q = new QuelqueChose(document.body); } -const monObjet = new UneClass(); -monObjet.enregistrer();</pre> +const myObject = new SomeClass(); +myObject.register(); +</pre> -<h3 id="Passer_des_données_à_et_depuis_un_écouteur_dévènements">Passer des données à et depuis un écouteur d'évènements</h3> +<h3 id="Getting_data_into_and_out_of_an_event_listener">Passer des données à et depuis un écouteur d'évènements</h3> -<p>On peut avoir l'impression que les écouteurs d'évènements sont comme des îles et qu'il est extrêmement difficile de leur passer des données quelconques, encore moins d'en récupérer après qu'ils ont été exécutés. Les écouteurs d'évènements ne prennent qu'un seul argument, l'<a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Event_objects">Event Object</a>, qui est passé automatiquement à l'écouteur, et la valeur retournée est ignorée. Donc à nouveau, comment pouvons-nous leur passer des données et en récupérer ? Il y a certain nombre de bonnes méthodes pour ce faire.</p> +<p>On peut avoir l'impression que les écouteurs d'évènements sont comme des îles et qu'il est extrêmement difficile de leur passer des données quelconques, encore moins d'en récupérer après qu'ils ont été exécutés. Les écouteurs d'évènements ne prennent qu'un seul argument, l'objet <a href="/fr/docs/Learn/JavaScript/Building_blocks/Events#event_objects"><code>event</code></a>, qui est passé automatiquement à l'écouteur, et la valeur retournée est ignorée. Aussi, comment pouvons-nous leur passer des données et en récupérer ? Il y a certain nombre de bonnes méthodes pour ce faire.</p> -<h4 id="Passer_des_données_à_un_écouteur_dévènement_en_utilisant_this">Passer des données à un écouteur d'évènement en utilisant "this"</h4> +<h4 id="Getting_data_into_an_event_listener_using_this">Passer des données à un écouteur d'évènement en utilisant "this"</h4> -<p>Comme mentionné <a href="https://wiki.developer.mozilla.org/fr/docs/Web/API/EventTarget/addEventListener$edit#Specifying_this_using_bind">ci-dessus</a>, vous pouvez utiliser <code>Function.prototype.bind()</code> pour passer une valeur à un écouteur d'évènements via la variable de référence <code>this</code>.</p> +<p>Comme mentionné <a href="#specifying_this_using_bind">ci-dessus</a>, vous pouvez utiliser <code>Function.prototype.bind()</code> pour passer une valeur à un écouteur d'évènements via la variable de référence <code>this</code>.</p> -<pre class="brush: js notranslate">const monBouton = document.getElementById('id-de-mon-bouton'); -const uneChaine = 'Données'; +<pre class="brush: js"> +const myButton = document.getElementById('my-button-id'); +const someString = 'Donnée'; -monButton.addEventListener('click', function () { - console.log(this); // Valeur Attendue : 'Données' -}.bind(uneChaine)); +myButton.addEventListener('click', function () { + console.log(this); // Valeur attendue : "Donnée". +}.bind(someString)); </pre> <p>Cette méthode est appropriée quand vous n'avez pas besoin de savoir sur quel élément HTML l'écouteur d'évènement a été déclenché par programme depuis l'intérieur de l'écouteur d'évènements. Le principal avantage de cette façon de faire est que l'écouteur d'évènements reçoit les données sensiblement de la même manière qu'il le ferait si vous les lui passiez au moyen de sa liste d'arguments.</p> -<h4 id="Passer_des_données_à_un_écouteur_dévènements_en_utilisant_une_propriété_de_portée_externe">Passer des données à un écouteur d'évènements en utilisant une propriété de portée externe</h4> +<h4 id="Getting_data_into_an_event_listener_using_the_outer_scope_property">Passer des données à un écouteur d'évènements en utilisant une propriété de portée externe</h4> -<p>Quand une portée externe contient une déclaration de variable (avec <code>const</code>, <code>let</code>), toutes les fonctions internes déclarées dans cette portée ont accès à cette variable (voir <a href="https://wiki.developer.mozilla.org/fr-FR/docs/Glossary/Function#Different_types_of_functions">ici</a> pour des informations sur les fonctions externes/internes, et <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var#Implicit_globals_and_outer_function_scope">ici</a> pour des informations sur la portée des variables). Par conséquent, une des façons les plus simples pour accéder à des données depuis l'extérieur d'un écouteur d'évènements est de le rendre accessible dans la portée dans laquelle l'écouteur d'évènement est déclaré.</p> +<p>Quand une portée externe contient une déclaration de variable (avec <code>const</code>, <code>let</code>), toutes les fonctions internes déclarées dans cette portée ont accès à cette variable (voir <a href="/fr/docs/Glossary/Function#different_types_of_functions">ici</a> pour des informations sur les fonctions externes/internes, et <a href="/fr/docs/Web/JavaScript/Reference/Statements/var#implicit_globals_and_outer_function_scope">ici</a> pour des informations sur la portée des variables). Par conséquent, une des façons les plus simples pour accéder à des données depuis l'extérieur d'un écouteur d'évènements est de le rendre accessible dans la portée dans laquelle l'écouteur d'évènement est déclaré.</p> -<pre class="brush: js notranslate">const monButton = document.getElementById('id-de-mon-bouton'); -const uneChaine = 'Données'; +<pre class="brush: js"> +const myButton = document.getElementById('my-button-id'); +let someString = 'Donnée'; -monButton.addEventListener('click', function() { - console.log(uneChaine); // Valeur Attendue : 'Données' +myButton.addEventListener('click', function() { + console.log(someString); // Valeur attendue : 'Donnée' - uneChaine = 'Encore des Données'; + someString = 'Encore des données'; }); -console.log(uneChaine); // Valeur Attendue : 'Données' (ne produira jamais 'Encore des Données') +console.log(someString); // Valeur attendue : 'Donnée' (ne donnera jamais 'Encore des données') </pre> -<div class="note"> +<div class="notecard note"> <p><strong>Note :</strong> Bien que les portées internes aient accès aux variables <code>const</code> et <code>let</code> depuis les portées externes, vous ne pouvez pas vous attendre à ce que des changements quelconques de ces variables soient accessibles après la définition de l'écouteur d'évènements, à l'intérieur de la même portée externe. Pourquoi ? Simplement parce qu'au moment où l'écouteur d'évènements s'exécutera, la portée dans laquelle il a été défini pourra avoir déjà fini de s'exécuter.</p> </div> -<h4 id="Passer_des_données_à_et_depuis_un_écouteur_dévènements_en_utilisant_des_objets">Passer des données à et depuis un écouteur d'évènements en utilisant des objets</h4> +<h4 id="Getting_data_into_and_out_of_an_event_listener_using_objects">Passer des données à et depuis un écouteur d'évènements en utilisant des objets</h4> -<p>A l'inverse de la plupart des fonctions en JavaScript, les objets sont conservés en mémoire aussi longtemps qu'une variable les référençant existe en mémoire. Ceci, et le fait que les objets peuvent avoir des propriétés, et qu'ils peuvent être passés alentour par référence, en fait des candidats plausibles pour partager des données entre les portées. Explorons cela.</p> +<p>A l'inverse de la plupart des fonctions en JavaScript, les objets sont conservés en mémoire aussi longtemps qu'une variable les référençant existe en mémoire. Ceci, et le fait que les objets peuvent avoir des propriétés, et qu'ils peuvent être passés alentour par référence, en font des candidats plausibles pour partager des données entre les portées. Explorons cela.</p> -<div class="note"> -<p><strong>Note :</strong> les fonctions en JavaScript sont en fait des objets. (Par conséquent, elles aussi peuvent avoir des propriétés, et seront conservées en mémoire même après qu'elles ont fini de s'exécuter, si elles ont été affectées à une variable qui persiste en mémoire.)</p> +<div class="notecard note"> +<p><strong>Note :</strong> Les fonctions en JavaScript sont en fait des objets. (Par conséquent, elles aussi peuvent avoir des propriétés, et seront conservées en mémoire même après qu'elles ont fini de s'exécuter, si elles ont été affectées à une variable qui persiste en mémoire.)</p> </div> <p>Du fait que les propriétés d'un objet peuvent être utilisées pour stocker des données en mémoire aussi longtemps qu'une variable référençant l'objet existe en mémoire, vous pouvez en fait les utiliser pour passer des données dans un écouteur d'évènements, et retourner tous les changements aux données après que l'écouteur d'évènements s'est exécuté. Considérez cet exemple :</p> -<pre class="brush: js notranslate">const monBouton = document.getElementById('id-de-mon-bouton'); -const unObjet = {unePropriete: 'Données'}; +<pre class="brush: js"> +const myButton = document.getElementById('my-button-id'); +const someObject = {aProperty: 'Donnée'}; -monButton.addEventListener('click', function() { - console.log(unObjet.unePropriete); // Valeur Attendue : 'Données' +myButton.addEventListener('click', function() { + console.log(someObject.aProperty); // Valeur attendue : "Donnée". - unObjet.unePropriete = 'Encore des Données'; // Changer la valeur + someObject.aProperty = 'Encore des données'; // Modifie la valeur }); window.setInterval(function() { - if (unObjet.unePropriete === 'Encore des Données') { - console.log('Encore des Données: Vrai'); - unObjet.unePropriete = 'Données'; // Réinitialiser la valeur pour attendre la prochaine exécution de l'évènement + if (someObject.aProperty === 'Encore des données') { + console.log('Encore des données : Vrai'); + someObject.aProperty = 'Donnée'; // Rétablit la valeur pour attendre l'exécution du prochain évènement } }, 5000); </pre> -<p>Dans cet exemple, même si la portée dans laquelle à la fois l'écouteur d'évènements et la fonction d'intervalle ont été définis a fini de s'exécuter avant que la valeur originale de <code>unObjet.unePropriete</code> ait changé, du fait que <code>someObject</code> persiste en mémoire (par <em>référence</em>) à la fois dans l'écouteur d'évènements et dans la fonction d'intervalle, tous deux ont accès aux mêmes données (i.e. quand l'un change les données, l'autre peut répondre aux changements).</p> +<p>Dans cet exemple, même si la portée dans laquelle à la fois l'écouteur d'évènements et la fonction d'intervalle ont été définis a fini de s'exécuter avant que la valeur originale de <code>unObjet.unePropriete</code> ait changé, du fait que <code>someObject</code> persiste en mémoire (par référence) à la fois dans l'écouteur d'évènements et dans la fonction d'intervalle, tous deux ont accès aux mêmes données (i.e. quand l'un change les données, l'autre peut répondre aux changements).</p> -<div class="note"> -<p><strong>Note :</strong> les objets sont stockés dans les variables par référence, ce qui signifie que seul l'emplacement en mémoire des données elles-mêmes est stocké dans la variable. Entre autres choses, cela signifie que les variables qui "stockent" des objets peuvent en fait affecter d'autres variables qui se voient affecter ("stocker") la même référence d'objet. Quand deux variables référencent le même objet (par ex., <code>let a = b = {unePropriete: 'Ouais'};</code>), le fait de changer les données dans l'une ou l'autre des variables affectera l'autre.</p> +<div class="notecard note"> + <p><strong>Note :</strong> Les objets sont stockés dans les variables par référence, ce qui signifie que seul l'emplacement en mémoire des données elles-mêmes est stocké dans la variable. Entre autres choses, cela signifie que les variables qui "stockent" des objets peuvent en fait affecter d'autres variables qui se voient affecter ("stocker") la même référence d'objet. Quand deux variables référencent le même objet (par ex., <code>let a = b = {aProperty: 'Ouai'};</code>), le fait de changer les données dans l'une ou l'autre des variables affectera l'autre.</p> </div> -<div class="note"> -<p><strong>Note :</strong> du fait que les objets sont stockés dans les variables par référence, vous pouvez retourner un objet depuis une fonction pour le maintenir en vie (le conserver en mémoire, de sorte que vous n'en perdiez pas les données) après que cette fonction a fini de s'exécuter.</p> +<div class="notecard note"> + <p><strong>Note :</strong> Du fait que les objets sont stockés dans les variables par référence, vous pouvez retourner un objet depuis une fonction pour le maintenir en vie (le conserver en mémoire, de sorte que vous n'en perdiez pas les données) après que cette fonction a fini de s'exécuter.</p> </div> -<h3 id="Héritage_Internet_Explorer_et_attachEvent"> Héritage Internet Explorer et attachEvent</h3> +<h3 id="Legacy_Internet_Explorer_and_attachEvent">Prise en charge d'Internet Explorer et attachEvent</h3> -<p>Dans les versions Internet Explorer versions avant IE 9, vous deviez utiliser {{domxref("EventTarget.attachEvent", "attachEvent()")}}, plutôt que la méthode standard <code>addEventListener</code>. Pour IE, nous modifions l'exemple précédent en :</p> +<p>Dans les versions Internet Explorer versions avant IE 9, vous deviez utiliser <code>attachEvent()</code> plutôt que la méthode standard <code>addEventListener</code>. Pour IE, nous modifions l'exemple précédent en :</p> -<pre class="brush: js line-numbers language-js notranslate">if (el.addEventListener) { +<pre class="brush: js"> +if (el.addEventListener) { el.addEventListener('click', modifierTexte, false); } else if (el.attachEvent) { el.attachEvent('onclick', modifierTexte); -}</pre> +} +</pre> <p>Il y a un inconvénient avec <code>attachEvent</code> : la valeur de <code>this</code> sera une référence à l'objet <code>window</code>, au lieu de l'élément sur lequel il a été déclenché.</p> <p>La méthode <code>attachEvent()</code> peut être couplée avec l'évènement <code>onresize</code> pour détecter que certains éléments dans une page web ont été redimensionnés. L'évènement propriétaire <code>mselementresize</code>, lorsqu'il est couplé avec la méthode <code>addEventListener</code> d'enregistrement des gestionnaires d'évènements, fournit une fonctionnalité similaire à celle de <code>onresize</code>, se déclenchant quand certains éléments HTML sont redimensionnés.</p> -<h3 id="Émulation">Émulation</h3> +<h3 id="Polyfill">Prothèse d'émulation (<i>polyfill</i>)</h3> <p>Vous pouvez contourner le fait que <code>addEventListener()</code>, <code>removeEventListener()</code>, {{domxref("Event.preventDefault()")}} et {{domxref("Event.stopPropagation()")}} ne sont pas pris en charge par IE 8 en utilisant le code suivant au début de votre script. Le code prend en charge l'utilisation de <code>handleEvent()</code>, et aussi l'évènement {{event("DOMContentLoaded")}}.</p> -<div class="note"> -<p><strong>Note : </strong><code>useCapture</code> n'est pas pris en charge, du fait qu'IE 8 n'a aucune méthode alternative. Le code suivant ajoute seulement la prise en charge d'IE 8. Cette émulation pour IE 8 fonctionne uniquement en mode standard : une déclaration <code>doctype</code> est requise.</p> +<div class="cardnote note"> + <p><strong>Note :</strong> <code>useCapture</code> n'est pas pris en charge, du fait qu'IE 8 n'a aucune méthode alternative. Le code suivant ajoute seulement la prise en charge d'IE 8. Cette émulation pour IE 8 fonctionne uniquement en mode standard : une déclaration <code>doctype</code> est requise.</p> </div> -<pre class="brush: js line-numbers language-js notranslate">(function() { +<pre class="brush: js"> +(function() { if (!Event.prototype.preventDefault) { Event.prototype.preventDefault=function() { this.returnValue=false; @@ -638,14 +739,17 @@ window.setInterval(function() { Window.prototype.removeEventListener=removeEventListener; } } -})();</pre> +})(); +</pre> -<h3 id="Ancienne_manière_denregistrer_les_écouteurs_dévènements">Ancienne manière d'enregistrer les écouteurs d'évènements</h3> +<h3 id="Older_way_to_register_event_listeners">Ancienne manière d'enregistrer les écouteurs d'évènements</h3> -<p>La méthode <code>addEventListener()</code> a été ajoutée dans la spécification DOM 2 <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events">Events</a>. Avant cela, les écouteurs d'évènements étaient enregistrés de la manière suivante :</p> +<p>La méthode <code>addEventListener()</code> a été ajoutée dans la spécification DOM 2 <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events">Events</a>. Avant cela, les écouteurs d'évènements étaient enregistrés de la manière suivante :</p> -<pre class="notranslate">// Passage d'une référence à une fonction — ne pas ajouter de '()' après, cela appelerait la fonction ! -el.onclick = modifierTexte; +<pre class="brush: js"> +// Passage d'une référence à une fonction +// Ne pas ajouter de '()' après, cela appelerait la fonction ! +el.onclick = modifyText; // Utilisation d'une fonction directe element.onclick = function() { @@ -653,64 +757,68 @@ element.onclick = function() { }; </pre> -<p>Cette méthode remplace l'(les)écouteur(s) d'évènements <code>click</code> existant(s) de l'élément s'il y en a. D'autres évènements et leurs gestionnaires d'évènements associés comme <code>blur</code> (<code>onblur</code>), et <code>keypress</code> ( <code>onkeypress</code>) se comportent de façon similaire.</p> +<p>Cette méthode remplace l'(les) écouteur(s) d'évènements <code>click</code> existant(s) de l'élément s'il y en a. D'autres évènements et leurs gestionnaires d'évènements associés comme <code>blur</code> (<code>onblur</code>), et <code>keypress</code> ( <code>onkeypress</code>) se comportent de façon similaire.</p> -<p>Comme elle faisait partie de façon fondamentale du DOM 0, cette méthode est très largement prise en charge et ne nécessite aucun code multi-navigateur. C'est pourquoi elle est souvent utilisée pour enregistrer des évènements dynamiquement quand de très anciens navigateurs (comme IE <=8) doivent être pris en charge ; voir la table plus bas pour les détails de la prise en charge par les navigateurs pour <code>addEventListener</code>.</p> +<p>Comme elle faisait partie de façon fondamentale du DOM 0, cette méthode est très largement prise en charge et ne nécessite aucun code multi-navigateur. C'est pourquoi elle est souvent utilisée pour enregistrer des évènements dynamiquement quand de très anciens navigateurs (comme IE dans les versions antérieures à IE8) doivent être pris en charge ; voir la table plus bas pour les détails de la prise en charge par les navigateurs pour <code>addEventListener</code>.</p> -<h3 id="Problèmes_de_mémoire">Problèmes de mémoire</h3> +<h3 id="Memory_issues">Problèmes de mémoire</h3> -<pre class="brush: js line-numbers language-js notranslate">var i; -var els = document.getElementsByTagName('*'); +<pre class="brush: js"> +let i; +const els = document.getElementsByTagName('*'); // Cas 1 -for(i=0 ; i<els.length ; i++){ +for (i=0 ; i<els.length ; i++) { els[i].addEventListener("click", function(e){/*faire quelque chose*/}, false); } // Cas 2 -function traiterEvenement(e){ +function processEvent(e) { /* faire quelque chose */ } -for(i=0 ; i<els.length ; i++){ - els[i].addEventListener("click", traiterEvenement, false); -}</pre> +for (i=0 ; i<els.length ; i++) { + els[i].addEventListener("click", processEvent, false); +} +</pre> -<p>Dans le premier cas ci-dessus, une nouvelle fonction gestionnaire (anonyme) est créée à chaque itération de la boucle. Dans le second cas, la même fonction déclarée préalablement est utilisée comme gestionnaire d'évènements. Cela entraîne une consommation de mémoire réduite. De plus, dans le premier cas, il n'est pas possible d'appeler {{domxref("EventTarget.removeEventListener", "removeEventListener()")}} du fait qu'aucune référence à la fonction anonyme n'est conservée (ou ici, n'est conservée aucune des multiples fonctions anonymes que la boucle peut créer). Dans le second cas, il est possible de faire <code>monElement.removeEventListener("click", traiterEvenement, false)</code> du fait que <code>traiterEvenement</code> est la référence à la fonction.</p> +<p>Dans le premier cas ci-dessus, une nouvelle fonction gestionnaire (anonyme) est créée à chaque itération de la boucle. Dans le second cas, la même fonction déclarée préalablement est utilisée comme gestionnaire d'évènements. Cela entraîne une consommation de mémoire réduite. De plus, dans le premier cas, il n'est pas possible d'appeler {{domxref("EventTarget.removeEventListener", "removeEventListener()")}} du fait qu'aucune référence à la fonction anonyme n'est conservée (ou ici, n'est conservée aucune des multiples fonctions anonymes que la boucle peut créer). Dans le second cas, il est possible de faire <code>myElement.removeEventListener("click", processEvent, false)</code> du fait que <code>processEvent</code> est la référence à la fonction.</p> <p>En fait, en ce qui concerne la consommation de mémoire, l'absence de conservation d'une référence à la fonction n'est pas le problème réel ; c'est plutôt l'absence de conservation d'une référence STATIQUE à la fonction. Dans les deux cas à problème ci-dessous, une référence à la fonction est conservée, mais du fait qu'elle est redéfinie à chaque itération, elle n'est pas statique. Dans le troisème cas, la référence à la fonction anonyme est réaffectée à chaque itération. Dans le quatrième cas, la définition entière de la fonction est inchangée, mais elle est néanmoins répétitivement définie comme si elle était nouvelle (à moins qu'elle n'ait été [[promue]] par le compilateur), et elle n'est donc pas statique. Par conséquent, bien qu'il ne semble y avoir simplement que des [[Multiple identical event listeners]], dans les deux cas, chaque itération créera à la place un nouvel écouteur avec sa propre unique référence à la fonction gestionnaire. Cependant, du fait que la définition de la fonction elle-même ne change pas, la MÊME fonction peut toujours être appelée pour chaque écouteur dupliqué (spécialement si le code est optimisé.)</p> <p>Également dans les deux cas, du fait que la référence à la fonction e été conservée mais est répétitivement redéfinie par chaque ajout, l'instruction 'remove' ci-dessus peut toujours supprimer un écouteur, mais seulement le dernier ajouté.</p> -<pre class="brush: js notranslate">// Pour illustration seulement : notez la "FAUTE" de [j] au lieu de [i] entrainant ainsi que les évènements voulus sont tous enregistrés pour le MÊME élément +<pre class="brush: js"> +// Pour illustration seulement : notez la "FAUTE" de [j] au lieu de [i] entrainant ainsi que les évènements voulus sont tous enregistrés pour le MÊME élément // Cas 3 -for(let i=0, j=0 ; i<els.length ; i++){ +for (let i=0, j=0 ; i<els.length ; i++) { /* faire des tas de choses avec j */ - els[j].addEventListener("click", traiterEvenement = function(e){/*faire quelque chose*/}, false); + els[j].addEventListener("click", processEvent = function(e) {/*faire quelque chose*/}, false); } // Cas 4 -for(let i=0, j=0 ; i<els.length ; i++){ +for (let i=0, j=0 ; i<els.length ; i++) { /* faire des tas de choses avec j */ - function traiterEvenement(e){/*faire quelque chose*/}; - els[j].addEventListener("click", traiterEvenement, false); + function processEvent(e) {/*faire quelque chose*/}; + els[j].addEventListener("click", processEvent, false); }</pre> -<h3 id="Amélioration_des_performances_de_défilement_avec_les_écouteurs_passifs">Amélioration des performances de défilement avec les écouteurs passifs</h3> +<h3 id="Improving_scrolling_performance_with_passive_listeners">Amélioration des performances de défilement avec les écouteurs passifs</h3> -<p>D'après la spécification, la valeur par défaut pour l'option <code>passive</code> est toujours <code>false</code> (<em>faux</em>). Toutefois, cela introduit la possibilité que des écouteurs d'évènements gérant certains évènements tactiles (parmi d'autres) bloquent le fil d'exécution principal du navigateur pendant qu'il essaye de gérer le défilement, avec pour résultat une possiblement énorme réduction de performance pendant la gestion du défilement.</p> +<p>D'après la spécification, la valeur par défaut pour l'option <code>passive</code> est toujours <code>false</code>. Toutefois, cela introduit la possibilité que des écouteurs d'évènements gérant certains évènements tactiles (parmi d'autres) bloquent le fil d'exécution principal du navigateur pendant qu'il essaye de gérer le défilement, avec pour résultat une possiblement énorme réduction de performance pendant la gestion du défilement.</p> <p>Pour prévenir ce problème, certains navigateurs (spécifiquement, Chrome et Firefox) ont changé la valeur par défault de l'option <code>passive</code> à <code>true</code> pour les évènements {{event("touchstart")}} et {{event("touchmove")}} dans les nœuds de niveau document {{domxref("Window")}}, {{domxref("Document")}}, et {{domxref("Document.body")}}. Cela empêche que l'écouteur d'évènement ne soit appelé, de sorte qu'il ne peut pas bloquer le rendu de la page pendant que l'utilisateur fait un défilement.</p> -<div class="note"> -<p><strong>Note :</strong> voir la table de compatibilité ci-dessous si vous avez besoin de savoir quels navigateurs (et/ou quelles versions de ces navigateurs) implémentent ce comportement modifié.</p> +<div class="notecard note"> + <p><strong>Note :</strong> Voir la table de compatibilité ci-dessous si vous avez besoin de savoir quels navigateurs (et/ou quelles versions de ces navigateurs) implémentent ce comportement modifié.</p> </div> <p>Vous pouvez passer outre ce comportement en initialisant explicitement la valeur de <code>passive</code> à <code>false</code>, comme montré ci-dessous :</p> -<pre class="brush: js notranslate">/* Détection de fonctionnalité */ -let passiveSiSupportee = false; +<pre class="brush: js"> +/* Détection de la fonctionnalité */ +let passiveIfSupported = false; try { window.addEventListener("test", null, @@ -718,58 +826,59 @@ try { {}, "passive", { - get: function() { passiveSiSupportee = { passive: false }; } + get: function() { passiveIfSupported = { passive: true }; } } ) ); } catch(err) {} -window.addEventListener('scroll', function(evenement) { +window.addEventListener('scroll', function(event) { /* faire quelque chose */ - // pas possible d'utiliser evenement.preventDefault(); -}, passiveSiSupportee );</pre> + // ne peut pas utiliser event.preventDefault(); +}, passiveIfSupported ); +</pre> -<p>Dans les navigateurs anciens qui ne prennent pas en charge le paramètre <code>options</code> d'<code>addEventListener()</code>, le fait d'essayer de l'utiliser empêche l'utilisation de l'argument <code>useCapture</code> sans utilisation appropriée de la <a href="https://wiki.developer.mozilla.org/fr/docs/Web/API/EventTarget/addEventListener$edit#Safely_detecting_option_support">détection de fonctionnalité</a>.</p> +<p>Dans les navigateurs anciens qui ne prennent pas en charge le paramètre <code>options</code> d'<code>addEventListener()</code>, le fait d'essayer de l'utiliser empêche l'utilisation de l'argument <code>useCapture</code> sans utilisation appropriée de la <a href="#safely_detecting_option_support">détection de fonctionnalité</a>.</p> <p>Vous n'avez pas besoin de vous inquiéter de la valeur de <code>passive</code> pour l'évènement {{event("scroll")}} de base. Du fait qu'il ne peut pas être annulé, les écouteurs d'évènements ne peuvant pas bloquer le rendu de la page de toute façon.</p> -<h2 id="Spécifications">Spécifications</h2> +<h2 id="Specifications">Spécifications</h2> <table class="standard-table"> - <tbody> - <tr> - <th>Spécification</th> - <th>Statut</th> - <th>Commentaire</th> - </tr> - <tr> - <td>{{SpecName("DOM WHATWG", "#dom-eventtarget-addeventlistener", "EventTarget.addEventListener()")}}</td> - <td>{{Spec2("DOM WHATWG")}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName("DOM4", "#dom-eventtarget-addeventlistener", "EventTarget.addEventListener()")}}</td> - <td>{{Spec2("DOM4")}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName("DOM2 Events", "#Events-EventTarget-addEventListener", "EventTarget.addEventListener()")}}</td> - <td>{{Spec2("DOM2 Events")}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> + <thead> + <tr> + <th>Spécification</th> + <th>Statut</th> + <th>Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName("DOM WHATWG", "#dom-eventtarget-addeventlistener", "EventTarget.addEventListener()")}}</td> + <td>{{Spec2("DOM WHATWG")}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName("DOM4", "#dom-eventtarget-addeventlistener", "EventTarget.addEventListener()")}}</td> + <td>{{Spec2("DOM4")}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName("DOM2 Events", "#Events-EventTarget-addEventListener", "EventTarget.addEventListener()")}}</td> + <td>{{Spec2("DOM2 Events")}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> </table> -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<div class="hidden">La table de compatibilité de cette page est générée à partir de données structurées. Si vous souhaitez contribuer aux données, visitez <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez nous une "pull request".</div> +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> <p>{{Compat("api.EventTarget.addEventListener", 3)}}</p> -<h2 id="Voir_aussi">Voir aussi</h2> +<h2 id="See_also">Voir aussi</h2> <ul> - <li>{{domxref("EventTarget.removeEventListener()")}}</li> - <li><a href="https://developer.mozilla.org/fr/docs/Web/Guide/DOM/Events/Creating_and_triggering_events">Création et déclenchement d'évènements personnalisés</a></li> - <li><a href="http://www.quirksmode.org/js/this.html">Plus de détails sur l'utilisation de <code>this</code> dans les gestionnaires d'évènements</a></li> + <li>{{domxref("EventTarget.removeEventListener()")}}</li> + <li><a href="/fr/docs/Web/Guide/Events/Creating_and_triggering_events">Création et déclenchement d'évènements</a></li> + <li><a href="http://www.quirksmode.org/js/this.html">Plus de détails sur l'utilisation de <code>this</code> dans les gestionnaires d'évènements</a></li> </ul> diff --git a/files/fr/web/api/performance/clearmarks/index.html b/files/fr/web/api/performance/clearmarks/index.html new file mode 100644 index 0000000000..31634399f9 --- /dev/null +++ b/files/fr/web/api/performance/clearmarks/index.html @@ -0,0 +1,93 @@ +--- +title: performance.clearMarks() +slug: Web/API/Performance/clearMarks +tags: + - API + - Method + - Méthode + - Reference + - Performance web +translation_of: Web/API/Performance/clearMarks +--- +<div>{{APIRef("User Timing API")}}</div> + +<p class="seoSummary">La méthode <strong><code>clearMarks()</code></strong> supprime les <em>marqueurs nommés</em> du tampon d'entrée des performances du navigateur. Si la méthode est appelée sans arguments, toutes les {{domxref("PerformanceEntry", "entrées de performance","",1)}} avec un {{domxref("PerformanceEntry.entryType", "entryType")}} de « <code>mark</code> » seront supprimées du tampon d'entrée de performance.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + <em>performance</em>.clearMarks(); + <em>performance</em>.clearMarks(name); +</pre> + +<h3 id="Arguments">Arguments</h3> + +<dl> + <dt>name {{optional_inline}}</dt> + <dd>Un {{domxref("DOMString")}} représentant le nom de l'horodatage. Si cet argument est omis, toutes les {{domxref("PerformanceEntry","entrées de performance","",1)}} avec un {{domxref("PerformanceEntry.entryType","entryType")}} de « <code>mark</code> » seront supprimés.</dd> +</dl> + +<h3 id="Return_value">Valeur de retour</h3> + +<p>Aucune.</p> + +<h2 id="Example">Exemple</h2> + +<p>L'exemple suivant montre les deux utilisations de la méthode <code>clearMarks()</code>.</p> + +<pre class="brush: js">// Créé une petite aide pour montrer combien d'entrées PerformanceMark il y a. +function logMarkCount() { + console.log( + "J'ai trouvé autant d'entrées : " + performance.getEntriesByType("mark").length + ); +} + +// Crée une série de marqueurs. +performance.mark("squirrel"); +performance.mark("squirrel"); +performance.mark("monkey"); +performance.mark("monkey"); +performance.mark("dog"); +performance.mark("dog"); + +logMarkCount() // "J'ai trouvé autant d'entrées : 6" + +// Supprime seulement les entrées "squirrel" de PerformanceMark. +performance.clearMarks('squirrel'); +logMarkCount() // "J'ai trouvé autant d'entrées : 4" + +// Supprime toutes les entrées de PerformanceMark. +performance.clearMarks(); +logMarkCount() // "J'ai trouvé autant d'entrées : 0" +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('User Timing Level 2', '#dom-performance-clearmarks', + 'clearMarks()')}}</td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td>Clarification de <code>clearMarks()</code>.</td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#dom-performance-clearmarks', 'clearMarks()')}}</td> + <td>{{Spec2('User Timing')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.clearMarks")}}</p> diff --git a/files/fr/web/api/performance/clearmeasures/index.html b/files/fr/web/api/performance/clearmeasures/index.html new file mode 100644 index 0000000000..c63eff637d --- /dev/null +++ b/files/fr/web/api/performance/clearmeasures/index.html @@ -0,0 +1,95 @@ +--- +title: performance.clearMeasures() +slug: Web/API/Performance/clearMeasures +tags: + - API + - Method + - Méthode + - Reference + - Performance web +translation_of: Web/API/Performance/clearMeasures +--- +<div>{{APIRef("User Timing API")}}</div> + +<p class="seoSummary">La méthode <strong><code>clearMeasures()</code></strong> supprime les <em>mesures nommées</em> du tampon d'entrée des performances du navigateur. Si la méthode est appelée sans arguments, toutes les {{domxref("PerformanceEntry", "entrées de performance","",1)}} avec un {{domxref("PerformanceEntry.entryType","entryType")}} de « <code>measure</code> » seront supprimées du tampon d'entrée de performance.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + <em>performance</em>.clearMeasures(); + <em>performance</em>.clearMeasures(name); +</pre> + +<h3 id="Arguments">Arguments</h3> + +<dl> + <dt>name {{optional_inline}}</dt> + <dd>Un {{domxref("DOMString")}} représentant le nom de l'horodatage. Si cet argument est omis, toutes les {{domxref("PerformanceEntry","entrées de performance","",1)}} avec un {{domxref("PerformanceEntry.entryType","entrType")}} de « <code>measure</code> » seront supprimés.</dd> +</dl> + +<h3 id="Return_value">Valeur de retour</h3> + +<p>Aucune.</p> + +<h2 id="Example">Exemple</h2> + +<p>L'exemple suivant montre les deux utilisations de la méthode <code>clearMeasures()</code>.</p> + +<pre class="brush: js">// Crée une petite aide pour montrer combien d'entrées PerformanceMeasure il y a. +function logMeasureCount() { + console.log( + "J'ai trouvé ces nombreuses entrées : " + performance.getEntriesByType("measure").length + ); +} + +// Crée un ensemble de mesures. +performance.measure("from navigation"); +performance.mark("a"); +performance.measure("from mark a", "a"); +performance.measure("from navigation"); +performance.measure("from mark a", "a"); +performance.mark("b"); +performance.measure("between a and b", "a", "b"); + +logMeasureCount() // "J'ai trouvé ces nombreuses entrées : 5" + +// Supprime uniquement les entrées PerformanceMeasure "from navigation". +performance.clearMeasures("from navigation"); +logMeasureCount() // "J'ai trouvé ces nombreuses entrées : 3" + +// Supprime toutes les entrées de PerformanceMeasure. +performance.clearMeasures(); +logMeasureCount() // "J'ai trouvé ces nombreuses entrées : 0" +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('User Timing Level 2', '#dom-performance-clearmeasures', + 'clearMeasures()')}}</td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td>Carification de <code>clearMeasures()</code>.</td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#dom-performance-clearmeasures', 'clearMeasures()')}} + </td> + <td>{{Spec2('User Timing')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.clearMeasures")}}</p> diff --git a/files/fr/web/api/performance/clearresourcetimings/index.html b/files/fr/web/api/performance/clearresourcetimings/index.html new file mode 100644 index 0000000000..a6da2caf50 --- /dev/null +++ b/files/fr/web/api/performance/clearresourcetimings/index.html @@ -0,0 +1,84 @@ +--- +title: performance.clearResourceTimings() +slug: Web/API/Performance/clearResourceTimings +tags: +- API +- Method +- Méthode +- Reference +- Performance web +translation_of: Web/API/Performance/clearResourceTimings +--- +<div>{{APIRef("Resource Timing API")}}</div> + +<p class="seoSummary">La méthode <strong><code>clearResourceTimings()</code></strong> supprime toutes les {{domxref("PerformanceEntry", "entrées de performance","",1)}} avec un {{domxref("PerformanceEntry.entryType","entryType")}} de « <code>resource</code> » du tampon d'entrée de performance et fixe la taille du tampon de données de performance à zéro. Pour définir la taille du tampon de données de performance du navigateur, utilisez la méthode {{domxref("Performance.setResourceTimingBufferSize()")}}.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"><em>performance</em>.clearResourceTimings(); +</pre> + +<h3 id="Arguments">Arguments</h3> + +<p>Aucun.</p> + +<h3 id="Return_Value">Valeur de retour</h3> + +<p>Aucune.</p> + +<h2 id="Example">Exemple</h2> + +<pre class="brush: js">function load_resource() { + var image = new Image(); + image.src = "https://developer.mozilla.org/static/img/opengraph-logo.png"; +} +function clear_performance_timings() { + if (performance === undefined) { + log("Le navigateur ne prend pas en charge les performances Web"); + return; + } + // Crée une entrée de performance de synchronisation des ressources en chargeant une image + load_resource(); + + var supported = typeof performance.clearResourceTimings == "function"; + if (supported) { + console.log("Exécuter : performance.clearResourceTimings()"); + performance.clearResourceTimings(); + } else { + console.log("performance.clearResourceTimings() N'EST PAS supporté"); + return; + } + // getEntries devrait maintenant retourner zéro + var p = performance.getEntriesByType("resource"); + if (p.length == 0) + console.log("... Le tampon de données de performance a été effacé"); + else + console.log("... Le tampon de données de performance n'a PAS été effacé !"); +} +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Resource Timing', '#dom-performance-clearresourcetimings', + 'clearResourceTimings()')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.clearResourceTimings")}}</p> diff --git a/files/fr/web/api/performance/getentries/index.html b/files/fr/web/api/performance/getentries/index.html new file mode 100644 index 0000000000..2cebfda905 --- /dev/null +++ b/files/fr/web/api/performance/getentries/index.html @@ -0,0 +1,104 @@ +--- +title: performance.getEntries() +slug: Web/API/Performance/getEntries +tags: +- API +- Method +- Méthode +- Reference +- Performance web +translation_of: Web/API/Performance/getEntries +--- +<div>{{APIRef("Performance Timeline API")}}</div> + +<p class="seoSummary">La méthode <strong><code>getEntries()</code></strong> renvoie une liste de tous les objets {{domxref("PerformanceEntry")}} pour la page. Les membres de la liste (<em>entrées</em>) peuvent être créés en faisant des <em>marqueurs</em> ou des <em>mesures</em> de performance (par exemple en appelant la méthode {{domxref("Performance.mark", "mark()")}}) à des moments explicites. Si vous souhaitez filtrer les entrées de performance en fonction de leur type ou de leur nom, consultez la documentation des méthodes {{domxref("Performance.getEntriesByType", "getEntriesByType()")}} et {{domxref("Performance.getEntriesByName", "getEntriesByName()")}}.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + <var>entries</var> = window.performance.getEntries(); +</pre> + +<h3 id="Return_Value">Valeur de retour</h3> + +<dl> + <dt><code>entries</code></dt> + <dd>Un tableau ({{jsxref("Array")}}) d'objets {{domxref("PerformanceEntry")}}. Les éléments seront classés par ordre chronologique en fonction des entrées {{domxref("PerformanceEntry.startTime","startTime")}}.</dd> +</dl> + +<h2 id="Example">Exemple</h2> + +<pre class="brush: js">function use_PerformanceEntry_methods() { + console.log("PerformanceEntry tests ..."); + + if (performance.mark === undefined) { + console.log("... performance.mark Non pris en charge"); + return; + } + + // Crée quelques entrées de performance via la méthode mark() + performance.mark("Begin"); + do_work(50000); + performance.mark("End"); + performance.mark("Begin"); + do_work(100000); + performance.mark("End"); + do_work(200000); + performance.mark("End"); + + // Utilise getEntries() pour itérer à travers chaque entrée. + let p = performance.getEntries(); + for (var i=0; i < p.length; i++) { + console.log("Entry[" + i + "]"); + check_PerformanceEntry(p[i]); + } + + // Utilise getEntriesByType() pour obtenir toutes les entrées "mark". + p = performance.getEntriesByType("mark"); + for (let i=0; i < p.length; i++) { + console.log ("Mark only entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } + + // Utilise getEntriesByName() pour obtenir toutes les entrées "mark" nommées "Begin". + p = performance.getEntriesByName("Begin", "mark"); + for (let i=0; i < p.length; i++) { + console.log ("Mark and Begin entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } +} +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Performance Timeline Level 2', '#dom-performance-getentries', + 'getEntries()')}}</td> + <td>{{Spec2('Performance Timeline Level 2')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline', '#dom-performance-getentries', + 'getEntries()')}}</td> + <td>{{Spec2('Performance Timeline')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.getEntries")}}</p> diff --git a/files/fr/web/api/performance/getentriesbyname/index.html b/files/fr/web/api/performance/getentriesbyname/index.html new file mode 100644 index 0000000000..c01ee9b633 --- /dev/null +++ b/files/fr/web/api/performance/getentriesbyname/index.html @@ -0,0 +1,120 @@ +--- +title: performance.getEntriesByName() +slug: Web/API/Performance/getEntriesByName +tags: + - API + - Method + - Méthode + - Reference + - Performance web +translation_of: Web/API/Performance/getEntriesByName +--- +<div>{{APIRef("Performance Timeline API")}}</div> + +<p class="seoSummary">La méthode <strong><code>getEntriesByName()</code></strong> renvoie une liste de tous les objets {{domxref("PerformanceEntry")}} ayant un nom (et éventuellement un type) donné(s). Les entrées de performance auront pu être créées au préalable avec des <em>marqueurs</em> ou des <em>mesures</em> de performance (par exemple en appelant la méthode {{domxref("Performance.mark", "mark()")}}) à des moments explicites.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + <var>entries</var> = window.performance.getEntriesByName(name, type); +</pre> + +<h3 id="Arguments">Arguments</h3> + +<dl> + <dt><code>name</code></dt> + <dd>Le nom de l'entrée à récupérer.</dd> + <dt><code>type</code> {{optional_inline}}</dt> + <dd>Le type d'entrée à récupérer tel que « <code>mark</code> ». Les types d'entrées valides sont listés dans {{domxref("PerformanceEntry.entryType")}}.</dd> +</dl> + +<h3 id="Return_Value">Valeur de retour</h3> + +<dl> + <dt><code>entries</code></dt> + <dd>Une liste de tous les objets {{domxref("PerformanceEntry")}} ayant le nom et le type spécifiés. Si l'argument <code>type</code> n'est pas spécifié, seul le nom (<code>name</code>) sera utilisé pour déterminer les entrées à renvoyer. Les éléments seront dans l'ordre chronologique basé sur les {{domxref("PerformanceEntry.startTime", "startTime")}} des entrées. Si aucun objet ne répond aux critères spécifiés, une liste vide est retournée.</dd> +</dl> + +<h2 id="Example">Exemple</h2> + +<pre class="brush: js">function use_PerformanceEntry_methods() { + log("PerformanceEntry tests ..."); + + if (performance.mark === undefined) { + log("... performance.mark Non pris en charge"); + return; + } + + // Crée quelques entrées de performance via la méthode mark() + performance.mark("Begin"); + do_work(50000); + performance.mark("End"); + performance.mark("Begin"); + do_work(100000); + performance.mark("End"); + do_work(200000); + performance.mark("End"); + + // Utilise getEntries() pour itérer à travers chaque entrée + var p = performance.getEntries(); + for (var i=0; i < p.length; i++) { + log("Entry[" + i + "]"); + check_PerformanceEntry(p[i]); + } + + // Utilise getEntries(name, entryType) pour obtenir des entrées spécifiques + p = performance.getEntries({name : "Begin", entryType: "mark"}); + for (var i=0; i < p.length; i++) { + log("Begin[" + i + "]"); + check_PerformanceEntry(p[i]); + } + + // Utilise getEntriesByType() pour obtenir toutes les entrées "mark" + p = performance.getEntriesByType("mark"); + for (var i=0; i < p.length; i++) { + log ("Mark only entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } + + // Utilisez getEntriesByName() pour obtenir toutes les entrées "mark" nommées "Begin" + p = performance.getEntriesByName("Begin", "mark"); + for (var i=0; i < p.length; i++) { + log ("Mark and Begin entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } +} +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Performance Timeline Level 2', '#dom-performance-getentriesbyname', + 'getEntriesByName()')}}</td> + <td>{{Spec2('Performance Timeline Level 2')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline', '#dom-performance-getentriesbyname', + 'getEntriesByName()')}}</td> + <td>{{Spec2('Performance Timeline')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.getEntriesByName")}}</p> diff --git a/files/fr/web/api/performance/getentriesbytype/index.html b/files/fr/web/api/performance/getentriesbytype/index.html new file mode 100644 index 0000000000..4f06729f3c --- /dev/null +++ b/files/fr/web/api/performance/getentriesbytype/index.html @@ -0,0 +1,118 @@ +--- +title: performance.getEntriesByType() +slug: Web/API/Performance/getEntriesByType +tags: +- API +- Method +- Méthode +- Reference +- Performance web +translation_of: Web/API/Performance/getEntriesByType +--- +<div>{{APIRef("Performance Timeline API")}}</div> + +<p class="seoSummary">La méthode <strong><code>getEntriesByName()</code></strong> renvoie une liste de tous les objets {{domxref("PerformanceEntry")}} pour le type donné. Les entrées de performance auront pu être créées au préalable avec des <em>marqueurs</em> ou des <em>mesures</em> de performance (par exemple en appelant la méthode {{domxref("Performance.mark", "mark()")}}) à des moments explicites.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + let <var>entries</var> = window.performance.getEntriesByType(type); +</pre> + +<h3 id="Arguments">Arguments</h3> + +<dl> + <dt><code>type</code></dt> + <dd>Le type d'entrée à récupérer tel que « <code>mark</code> ». Les types d'entrées valides sont listés dans {{domxref("PerformanceEntry.entryType")}}.</dd> +</dl> + +<h3 id="Return_Value">Valeur de retour</h3> + +<dl> + <dt><code>entries</code></dt> + <dd>Une liste de tous les objets {{domxref("PerformanceEntry")}} ayant le <em>type</em> spécifié. Les éléments seront triés dans l'ordre chronologique basé sur les propriétés {{domxref("PerformanceEntry.startTime", "startTime")}} des entrées. Si aucun objet ne possède le type spécifié, ou si aucun argument n'est fourni, une liste vide est renvoyée.</dd> +</dl> + +<h2 id="Example">Exemple</h2> + +<pre class="brush: js">function usePerformanceEntryMethods() { + log("PerformanceEntry tests ..."); + + if (performance.mark === undefined) { + log("... performance.mark Non pris en charge"); + return; + } + + // Crée quelques entrées de performance via la méthode mark() + performance.mark("Begin"); + doWork(50000); + performance.mark("End"); + performance.mark("Begin"); + doWork(100000); + performance.mark("End"); + doWork(200000); + performance.mark("End"); + + // Utilise getEntries() pour itérer à travers chaque entrée. + var p = performance.getEntries(); + for (var i=0; i < p.length; i++) { + log("Entry[" + i + "]"); + checkPerformanceEntry(p[i]); + } + + // Utilise getEntries(name, entryType) pour obtenir des entrées spécifiques. + p = performance.getEntries({name : "Begin", entryType: "mark"}); + for (var i=0; i < p.length; i++) { + log("Begin[" + i + "]"); + checkPerformanceEntry(p[i]); + } + + // Utilise getEntriesByType() pour obtenir toutes les entrées "mark". + p = performance.getEntriesByType("mark"); + for (var i=0; i < p.length; i++) { + log("Mark only entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } + + // Utilise getEntriesByName() pour obtenir toutes les entrées "mark" nommées "Begin". + p = performance.getEntriesByName("Begin", "mark"); + for (var i=0; i < p.length; i++) { + log("Mark and Begin entry[" + i + "]: name = " + p[i].name + + "; startTime = " + p[i].startTime + + "; duration = " + p[i].duration); + } +} +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Performance Timeline Level 2', '#dom-performance-getentriesbytype', + 'getEntriesByType()')}}</td> + <td>{{Spec2('Performance Timeline Level 2')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline', '#dom-performance-getentriesbytype', + 'getEntriesByType()')}}</td> + <td>{{Spec2('Performance Timeline')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.getEntriesByType")}}</p> diff --git a/files/fr/web/api/performance/index.html b/files/fr/web/api/performance/index.html index e139a6ac71..46d8e44241 100644 --- a/files/fr/web/api/performance/index.html +++ b/files/fr/web/api/performance/index.html @@ -3,117 +3,154 @@ title: Performance slug: Web/API/Performance tags: - API + - Navigation Timing - Performance - Performance Web + - Reference translation_of: Web/API/Performance --- -<div>{{APIRef("Navigation Timing")}}</div> +<div>{{APIRef("High Resolution Time")}}</div> -<p>L'interface <strong><code>Performance</code></strong> donne accès à des informations liées aux performances pour la page actuelle. Elle fait partie de l'API High Resolution Time, mais est complétée par les APIs <a href="/en-US/docs/Web/API/Performance_Timeline">Performance Timeline</a>, <a href="/en-US/docs/Web/API/Navigation_timing_API">Navigation Timing</a>, <a href="/en-US/docs/Web/API/User_Timing_API">User Timing</a>, et <a href="/en-US/docs/Web/API/Resource_Timing_API">Resource Timing</a>.</p> +<p class="seoSummary">L'interface <strong><code>Performance</code></strong> donne accès à des informations liées aux performances pour la page actuelle. Elle fait partie de l'API « High Resolution Time », mais est complétée par les APIs <a href="/fr/docs/Web/API/Performance_Timeline">Performance Timeline</a>, <a href="/fr/docs/Web/API/Navigation_timing_API">Navigation Timing</a>, <a href="/fr/docs/Web/API/User_Timing_API">User Timing</a>, et <a href="/fr/docs/Web/API/Resource_Timing_API">Resource Timing</a>.</p> -<p>Un objet de ce type peut être obtenu en appelant l'attribut en lecture seule {{domxref("Window.performance")}}.</p> +<p>Un objet de ce type peut être obtenu en appelant l'attribut en lecture seule {{domxref("window.performance")}}.</p> -<div class="note"> -<p><strong><em>Note</em>: </strong>Cette interface et ses attributs sont accessibles aux {{domxref("Web Worker")}} sauf dans les cas cités ci-dessous. Notez également que les marqueurs et les mesures de performance sont définis par contexte. Si vous créez un marqueur dans le processus principal (ou un autre Web Worker), vous ne pourrez pas le voir dans le processus du Web Worker, et réciproquement.</p> +<div class="notecard note"> + <p><strong>Note :</strong> Cette interface et ses attributs sont accessibles aux <a href="/fr/docs/Web/API/Web_Workers_API">Web Workers</a> via <code><a href="/fr/docs/Web/API/WorkerGlobalScope/performance">WorkerGlobalScope.performance</a></code> sauf dans les cas cités ci-dessous. Notez également que les marqueurs et les mesures de performance sont définis par contexte. Si vous créez un marqueur dans le processus principal (ou un autre Web Worker), vous ne pourrez pas le voir dans le processus du Web Worker, et réciproquement.</p> </div> -<h2 id="Propriétés">Propriétés</h2> +<h2 id="Properties">Propriétés</h2> -<p><em>L'interface<code>Performance</code> n'hérite d'aucune propriété.</em></p> +<p><em>L'interface <code>Performance</code> n'hérite d'aucune propriété.</em></p> <dl> - <dt>{{deprecated_inline}} {{domxref("performance.navigation")}} {{readonlyInline}}</dt> - <dd>{{domxref("PerformanceNavigation")}} est un objet qui fournit des informations contextuelles sur les opérations inclues dans les indicateurs de <code>timing</code>, notamment si la page a été chargée ou actualisée, combien de redirections ont été effectuées, etc… Indisponible dans les Web Workers.</dd> + <dt> + {{domxref("performance.navigation")}} {{readonlyInline}} {{deprecated_inline}} + </dt> + <dd> + {{domxref("PerformanceNavigation")}} est un objet qui fournit des informations contextuelles sur les opérations incluses dans les indicateurs de <code>timing</code>, notamment si la page a été chargée ou actualisée, combien de redirections ont été effectuées, etc… + <div class="notecard note"> + <p>Indisponible dans les Web Workers.</p> + </div> + </dd> + <dt> + {{domxref("performance.timing")}} {{readonlyInline}} {{deprecated_inline}} + </dt> + <dd> + {{domxref("PerformanceTiming")}} est un objet contenant des informations de performance liées à la latence. + <div class="notecard note"> + <p>Indisponible dans les Web Workers.</p> + </div> + </dd> + <dt> + {{domxref("performance.memory")}} {{readonlyInline}} {{Non-standard_inline}}</dt> + <dd> + Une extension <em>non standard</em> ajoutée dans Chrome, cette propriété fournit à un objet des informations de base sur l'utilisation de la mémoire. <em>Vous <strong>ne devriez pas utiliser</strong> cette API non standard.</em> + </dd> + <dt> + {{domxref("Performance.timeOrigin")}} {{readonlyInline}} {{Experimental_inline}} + </dt> + <dd> + Fournit un horodatage haute résolution de l'heure de début de la mesure de performance. + </dd> </dl> -<dl> - <dt>{{deprecated_inline}} {{domxref("performance.timing")}} {{readonlyInline}}</dt> - <dd>{{domxref("PerformanceTiming")}} est un objet contenant des informations de performance liées à la latence. Indisponible dans les Web Workers.</dd> - <dt>{{domxref("performance.memory")}} {{Non-standard_inline}}</dt> - <dd>{{domxref("PerformanceNavigation")}} est un objet non-standard ajouté dans Chrome, contenant des informations basiques d'utilisation de la mémoire.</dd> -</dl> - -<h2 id="Méthodes">Méthodes</h2> - -<p><em><em>L'interface <code>Performance</code> n'hérite d'aucune méthode</em></em>.</p> - -<p> </p> - -<dl> - <dt>{{domxref("performance.clearMarks()")}}</dt> - <dd>Supprime le <em>marqueur</em> indiqué des données de performances du navigateur mises en mémoire tampon.</dd> - <dt>{{domxref("performance.clearMeasures()")}}</dt> - <dd>Supprime la <em>mesure</em> indiquée des données de performances du navigateur mises en mémoire tampon.</dd> - <dt>{{domxref("performance.clearResourceTimings()")}}</dt> - <dd>Supprime toutes les {{domxref("PerformanceEntry","entrées de performance")}} avec un {{domxref("PerformanceEntry.entryType","entryType")}} "<code>resource</code>" des données de performances du navigateur mises en mémoire tampon.</dd> - <dt>{{domxref("performance.getEntries()")}}</dt> - <dd>Retourne une liste d'objets {domxref("PerformanceEntry")}} basée sur le <em>filter</em> indiqué.</dd> - <dt>{{domxref("performance.getEntriesByName()")}}</dt> - <dd>Retourne une liste d'objets {{domxref("PerformanceEntry")}} basée sur le <em>nom</em> d'entrée indiqué.</dd> - <dt>{{domxref("performance.getEntriesByType()")}}</dt> - <dd>Retourne une liste d'objets {{domxref("PerformanceEntry")}} basée sur le <em>type</em> d'entrée indiqué.</dd> - <dt>{{domxref("performance.mark()")}}</dt> - <dd>Crée un {{domxref("DOMHighResTimeStamp","timestamp")}} avec le nom indiqué, dans la mémoire tampon du navigateur dédiée aux performances.</dd> - <dt>{{domxref("performance.measure()")}}</dt> - <dd>Crée un {{domxref("DOMHighResTimeStamp","timestamp")}} nommé, dans la mémoire tampon du navigateur dédiée aux performances, entre deux marqueurs spécifiques (connus comme le <em>marqueur de début</em> et le <em>marqueur de fin</em>, respectivement).</dd> -</dl> +<h2 id="Methods">Méthodes</h2> -<p> </p> +<p><em>L'interface <code>Performance</code> n'hérite d'aucune méthode</em>.</p> <dl> - <dt>{{domxref("Performance.now()")}}</dt> - <dd>Retourne un objet {{domxref("DOMHighResTimeStamp")}} représentant le nombre de millisecondes écoulées depuis un instant donné.</dd> - <dt>{{domxref("performance.setResourceTimingBufferSize()")}}</dt> - <dd>Configure la taille de la mémoire tampon pour le chronométrage des ressources du navigateur, avec le nombre indiqué de {{domxref("PerformanceEntry.entryType","type")}} d'{{domxref("PerformanceEntry","performance entry")}}objets "<code>resource</code>" .</dd> - <dt>{{domxref("Performance.toJSON()")}} {{non-standard_inline}}</dt> - <dd>Retourne un objet JSON représentant l'objet <code>Performance</code>.</dd> - <dt> </dt> + <dt>{{domxref("performance.clearMarks()")}}</dt> + <dd>Supprime le <em>marqueur</em> indiqué des données de performances du navigateur mises en mémoire tampon.</dd> + <dt>{{domxref("performance.clearMeasures()")}}</dt> + <dd>Supprime la <em>mesure</em> indiquée des données de performances du navigateur mises en mémoire tampon.</dd> + <dt>{{domxref("performance.clearResourceTimings()")}}</dt> + <dd>Supprime toutes les {{domxref("PerformanceEntry","entrées de performance","",1)}} avec un {{domxref("PerformanceEntry.entryType","entryType")}} "<code>resource</code>" des données de performances du navigateur mises en mémoire tampon.</dd> + <dt>{{domxref("performance.getEntries()")}}</dt> + <dd>Retourne une liste d'objets {{domxref("PerformanceEntry")}} basée sur le <em>filtre</em> indiqué.</dd> + <dt>{{domxref("performance.getEntriesByName()")}}</dt> + <dd>Retourne une liste d'objets {{domxref("PerformanceEntry")}} basée sur le <em>nom</em> indiqué.</dd> + <dt>{{domxref("performance.getEntriesByType()")}}</dt> + <dd>Retourne une liste d'objets {{domxref("PerformanceEntry")}} basée sur le <em>type</em> indiqué.</dd> + <dt>{{domxref("performance.mark()")}}</dt> + <dd>Crée un {{domxref("DOMHighResTimeStamp","timestamp")}} avec le nom indiqué, dans la mémoire tampon du navigateur dédiée aux performances.</dd> + <dt>{{domxref("performance.measure()")}}</dt> + <dd>Crée un {{domxref("DOMHighResTimeStamp","timestamp")}} nommé, dans la mémoire tampon du navigateur dédiée aux performances, entre deux marqueurs spécifiques (connus comme le <em>marqueur de début</em> et le <em>marqueur de fin</em>, respectivement).</dd> + <dt>{{domxref("Performance.now()")}}</dt> + <dd>Retourne un objet {{domxref("DOMHighResTimeStamp")}} représentant le nombre de millisecondes écoulées depuis un instant donné.</dd> + <dt>{{domxref("performance.setResourceTimingBufferSize()")}}</dt> + <dd>Configure la taille de la mémoire tampon pour le chronométrage des ressources du navigateur. La valeur passée en argument indiquera le nombre maximal d'objets {{domxref("PerformanceEntry")}} ayant le {{domxref("PerformanceEntry.entryType","type")}} "<code>resource</code>" qu'il sera possible d'y stocker.</dd> + <dt>{{domxref("Performance.toJSON()")}}</dt> + <dd>Retourne un objet JSON représentant l'objet <code>Performance</code>.</dd> </dl> -<h2 id="Events">Events</h2> +<h2 id="Events">Événements</h2> -<p>Écoutez ces événéments en utilisant <code>addEventListener()</code> ou en assignant un écouteur d'événément à la propriété <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">on<em>EventName</em> de cette interface.</span></font></p> +<p>On pourra écouter ces événements en utilisant <code>addEventListener()</code> ou en assignant un gestionnaire d'événement à la propriété <code>on<em><EventName></em></code> de cette interface.</p> <dl> - <dt><code><a href="https://developer.mozilla.org/en-US/docs/Web/API/Performance/resourcetimingbufferfull_event">resourcetimingbufferfull</a></code></dt> - <dd>Déclenchée quaund les ressources de la mémoire tampon du navigateur pour le chronométrage est pleine.<br> - Également disponible via la propriété <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/Performance/onresourcetimingbufferfull">onresourcetimingbufferfull</a></code>.</dd> + <dt>{{DOMxRef("Performance.resourcetimingbufferfull_event", "resourcetimingbufferfull")}}</dt> + <dd>Déclenché lorsque le <a href="/fr/docs/Web/API/Performance/setResourceTimingBufferSize">tampon de synchronisation des ressources</a> du navigateur est plein. Également disponible via la propriété {{DOMxRef("Performance.onresourcetimingbufferfull", "onresourcetimingbufferfull")}}.</dd> </dl> -<h2 id="Spécifications">Spécifications</h2> +<h2 id="Specifications">Spécifications</h2> <table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaires</th> - </tr> - <tr> - <td>{{SpecName('Highres Time', '#sec-extenstions-performance-interface', 'Performance')}}</td> - <td>{{Spec2('Highres Time')}}</td> - <td>Ajout de la méthode <code>now()</code>.</td> - </tr> - <tr> - <td>{{SpecName('Navigation Timing', '#sec-window.performance-attribute', 'Performance')}}</td> - <td>{{Spec2('Navigation Timing')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Highres Time Level 2', '#sec-performance', 'Performance')}}</td> + <td>{{Spec2('Highres Time Level 2')}}</td> + <td>Définition de la méthode <code>toJson()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Highres Time', '#performance', 'Performance')}}</td> + <td>{{Spec2('Highres Time')}}</td> + <td>Définition de la méthode <code>now()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline Level 2', '#extensions-to-the-performance-interface', 'Performance extensions')}}</td> + <td>{{Spec2('Performance Timeline Level 2')}}</td> + <td>Changements sur l'interface <code>getEntries()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Performance Timeline', '#extensions-to-the-performance-interface', 'Performance extensions')}}</td> + <td>{{Spec2('Performance Timeline')}}</td> + <td>Définition des méthodes <code>getEntries()</code>, <code>getEntriesByType()</code> et <code>getEntriesByName()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Resource Timing', '#extensions-performance-interface', 'Performance extensions')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td>Définition des méthodes <code>clearResourceTimings()</code> et <code>setResourceTimingBufferSize()</code> et de la propriété <code>onresourcetimingbufferfull</code>.</td> + </tr> + <tr> + <td>{{SpecName('User Timing Level 2', '#extensions-performance-interface', 'Performance extensions')}}</td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td>Clarifications des méthodes <code>mark()</code>, <code>clearMark()</code>, <code>measure()</code> et <code>clearMeasure()</code>.</td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#extensions-performance-interface', 'Performance extensions')}}</td> + <td>{{Spec2('User Timing')}}</td> + <td>Définition des méthodes <code>mark()</code>, <code>clearMark()</code>, <code>measure()</code> et <code>clearMeasure()</code>.</td> + </tr> + </tbody> </table> -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<div> -<div> - +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> <p>{{Compat("api.Performance")}}</p> -</div> -</div> -<h2 id="Voir_aussi">Voir aussi</h2> +<h2 id="See_Also">Voir aussi</h2> <ul> - <li>Interfaces liées : {{domxref("PerformanceTiming")}}, {{domxref("PerformanceNavigation")}}.</li> + <li><a href="/fr/docs/Web/API/Performance_Timeline">Performance Timeline</a></li> + <li><a href="/fr/docs/Web/API/Navigation_timing_API">Navigation Timing API</a></li> + <li><a href="/fr/docs/Web/API/User_Timing_API">User Timing API</a></li> + <li><a href="/fr/docs/Web/API/Resource_Timing_API">Resource Timing API</a></li> </ul> diff --git a/files/fr/web/api/performance/mark/index.html b/files/fr/web/api/performance/mark/index.html new file mode 100644 index 0000000000..cdf21108b8 --- /dev/null +++ b/files/fr/web/api/performance/mark/index.html @@ -0,0 +1,91 @@ +--- +title: performance.mark() +slug: Web/API/Performance/mark +tags: +- API +- Method +- Méthode +- Reference +- Performance web +translation_of: Web/API/Performance/mark +--- +<div>{{APIRef("User Timing API")}}</div> + +<p class="seoSummary">La méthode <strong><code>mark()</code></strong> crée un {{domxref("DOMHighResTimeStamp", "timestamp")}} dans le <em>tampon d'entrée de performance</em> du navigateur avec le nom donné en argument.</p> + +<p>L'horodatage ainsi défini par l'application peut être récupéré par l'une des méthodes <code>getEntries*()</code> de l'interface {{domxref("Performance")}} ({{domxref("Performance.getEntries", "getEntries()")}}, {{domxref("Performance.getEntriesByName", "getEntriesByName()")}} ou {{domxref("Performance.getEntriesByType", "getEntriesByType()")}}).</p> + +<p>La méthode <code>mark()</code> stocke ses données en interne sous la forme d'objets {{domxref("PerformanceEntry")}}.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + performance.mark(name); +</pre> + +<h3 id="Arguments">Arguments</h3> + +<dl> + <dt><code>name</code></dt> + <dd>Une chaîne de caractères ({{domxref("DOMString")}}) représentant le nom du marqueur. Si le nom donné à cette méthode existe déjà dans l'interface {{domxref("PerformanceTiming")}}, une exception {{jsxref("SyntaxError")}} est levée.</dd> +</dl> + +<h3 id="Return_value">Valeur de retour</h3> + +<p>Aucune.</p>> + +<h2 id="Example">Exemple</h2> + +<p>L'exemple suivant montre comment utiliser <code>mark()</code> pour créer et récupérer des entrées {{domxref("PerformanceMark")}}.</p> + +<pre class="brush:js">// Crée un ensemble de marqueurs. +performance.mark("squirrel"); +performance.mark("squirrel"); +performance.mark("monkey"); +performance.mark("monkey"); +performance.mark("dog"); +performance.mark("dog"); + +// Obtient toutes les entrées de PerformanceMark. +const allEntries = performance.getEntriesByType("mark"); +console.log(allEntries.length); +// 6 + +// Obtient toutes les entrées "monkey" de PerformanceMark. +const monkeyEntries = performance.getEntriesByName("monkey"); +console.log(monkeyEntries.length); +// 2 + +// Efface tous les marqueurs. +performance.clearMarks(); +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('User Timing Level 2', '#dom-performance-mark', 'mark()')}}</td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td>Clarification du modèle de traitement <code>mark()</code>.</td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#dom-performance-mark', 'mark()')}}</td> + <td>{{Spec2('User Timing')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.mark")}}</p> diff --git a/files/fr/web/api/performance/measure/index.html b/files/fr/web/api/performance/measure/index.html new file mode 100644 index 0000000000..5809124222 --- /dev/null +++ b/files/fr/web/api/performance/measure/index.html @@ -0,0 +1,110 @@ +--- +title: performance.measure() +slug: Web/API/Performance/measure +tags: +- API +- Method +- Méthode +- Reference +- Performance web +- Web Workers +translation_of: Web/API/Performance/measure +--- +<div>{{APIRef("User Timing API")}}</div> + +<p class="seoSummary">La méthode <strong><code>measure()</code></strong> crée un {{domxref("DOMHighResTimeStamp", "timestamp")}} nommé dans le <em>tampon d'entrée de performance</em> du navigateur entre deux marqueurs, l'heure de début de navigation ou l'heure actuelle. Lors d'une mesure entre deux marqueurs, on aura un <em>marqueur de début</em> et un <em>marqueur de fin</em>. L'horodatage ainsi nommé est désigné comme une <em>mesure</em>.</p> + +<p>La mesure correspondante peut être récupérée par l'une des méthodes suivantes de l'interface {{domxref("Performance")}} : {{domxref("Performance.getEntries", "getEntries()")}}, {{domxref("Performance.getEntriesByName", "getEntriesByName()")}} ou {{domxref("Performance.getEntriesByType", "getEntriesByType()")}}.</p> + +<p>L'{{domxref("PerformanceEntry", "entrée de performance","",1)}} créée par <code>measure()</code> aura les valeurs de propriété suivantes :</p> + +<ul> + <li>{{domxref("PerformanceEntry.entryType","entryType")}} : <code>"measure"</code>.</li> + <li>{{domxref("PerformanceEntry.name","name")}} : le nom passé en argument lors de la création de la mesure (cf. ci-après).</li> + <li>{{domxref("PerformanceEntry.startTime","startTime")}} : fixé selon le marqueur de départ (type {{domxref("DOMHighResTimeStamp")}}).</li> + <li>{{domxref("PerformanceEntry.duration","duration")}} : fixé à un {{domxref("DOMHighResTimeStamp")}} qui correspond à la durée de la mesure (généralement, l'horodatage du marqueur de fin moins l'horodatage du marqueur de début).</li> +</ul> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + performance.measure(name); + performance.measure(name, startMark); + performance.measure(name, startMark, endMark); + performance.measure(name, undefined, endMark); +</pre> + +<h3 id="Arguments">Arguments</h3> + +<dl> + <dt><code>name</code></dt> + <dd>Une {{domxref("DOMString")}} représentant le nom de la mesure.</dd> + <dt><code>startMark</code> {{optional_inline}}</dt> + <dd>Une {{domxref("DOMString")}} représentant le nom du marqueur de départ de la mesure. Peut également être le nom d'une propriété {{domxref("PerformanceTiming")}}. Si elle est omise, l'heure de début sera celle de la navigation.</dd> + <dt><code>endMark</code> {{optional_inline}}</dt> + <dd>Une {{domxref("DOMString")}} représentant le nom du marqueur de fin de la mesure. Peut également être le nom d'une propriété {{domxref("PerformanceTiming")}}. Si elle est omise, le temps actuel est utilisé.</dd> +</dl> + +<h3 id="Return_value">Valeur de retour</h3> + +<p>Aucune</p> + +<h2 id="Example">Exemple</h2> + +<p>L'exemple suivant montre comment <code>measure()</code> est utilisé pour créer une nouvelle <em>mesure</em> d'{{domxref("PerformanceEntry", "entrée de performance","",1)}} dans le tampon d'entrée de performance du navigateur.</p> + +<pre class="brush: js">const markerNameA = "example-marker-a" +const markerNameB = "example-marker-b" + +// Exécute des temporisations imbriquées et crée un PerformanceMark pour chacune d'entre elles. +performance.mark(markerNameA); +setTimeout(function() { + performance.mark(markerNameB); + setTimeout(function() { + + // Crée une variété de mesures. + performance.measure("mesure a à b", markerNameA, markerNameB); + performance.measure("mesure a à maintenant", markerNameA); + performance.measure("mesure du début de la navigation à b", undefined, markerNameB); + performance.measure("mesure du début de la navigation à maintenant"); + + // Sort toutes les mesures. + console.log(performance.getEntriesByType("measure")); + + // Enfin, nettoye les entrées. + performance.clearMarks(); + performance.clearMeasures(); + }, 1000); +}, 1000); +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('User Timing Level 2', '#dom-performance-measure', 'measure()')}} + </td> + <td>{{Spec2('User Timing Level 2')}}</td> + <td>Clarification du modèle de traitement de <code>mesure()</code>.</td> + </tr> + <tr> + <td>{{SpecName('User Timing', '#dom-performance-measure', 'measure()')}}</td> + <td>{{Spec2('User Timing')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.measure")}}</p> diff --git a/files/fr/web/api/performance/memory/index.html b/files/fr/web/api/performance/memory/index.html new file mode 100644 index 0000000000..a98b747b49 --- /dev/null +++ b/files/fr/web/api/performance/memory/index.html @@ -0,0 +1,43 @@ +--- +title: performance.memory +slug: Web/API/Performance/memory +tags: + - API + - Reference + - Performance web +translation_of: Web/API/Performance/memory +--- +<p>{{APIRef}}</p> + +{{Non-standardGeneric('header')}} + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + <em>timingInfo</em> = <em>performance</em>.memory +</pre> + +<h2 id="Attributes">Attributs</h2> + +<dl> + <dt><code>jsHeapSizeLimit</code></dt> + <dd>La taille maximale du tas, en octets, qui est disponible pour le contexte.</dd> + <dt><code>totalJSHeapSize</code></dt> + <dd>La taille totale du répertoire alloué, en octets.</dd> + <dt>usedJSHeapSize</dt> + <dd>Le segment actuellement actif du répertoire JS, en octets.</dd> +</dl> + +<h2 id="Specifications">Spécifications</h2> + +<p>Aucune</p> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.memory")}}</p> + +<h2 id="See_also">Voir aussi</h2> + +<ul> + <li>L'interface {{domxref("Performance")}} à laquelle il appartient.</li> +</ul> diff --git a/files/fr/web/api/performance/navigation/index.html b/files/fr/web/api/performance/navigation/index.html index 7435d8c4ae..be37b1487a 100644 --- a/files/fr/web/api/performance/navigation/index.html +++ b/files/fr/web/api/performance/navigation/index.html @@ -1,52 +1,61 @@ --- -title: Performance.navigation +title: performance.navigation slug: Web/API/Performance/navigation tags: + - API + - Rétrocompatibilité + - Déprécié - HTTP - Performance - Propriété - - lecture seule + - Property + - Lecture seule + - Read-only + - Reference + - legacy translation_of: Web/API/Performance/navigation --- -<p>{{APIRef("Navigation Timing")}}</p> +<p>{{Deprecated_Header}}{{APIRef("Navigation Timing")}}</p> -<h2 id="Summary">Summary</h2> +<div class="notecard warning"> + <p>Cette propriété est dépréciée dans la spécification <a href="https://w3c.github.io/navigation-timing/#obsolete">Navigation Timing Level 2 specification</a>.</p> +</div> + +<p class="seoSummary">L'ancienne propriété en lecture seule <strong><code>Performance.navigation</code></strong> renvoie un objet {{domxref("PerformanceNavigation")}} représentant le type de navigation qui se produit dans le contexte de navigation donné, comme le nombre de redirections nécessaires pour aller chercher la ressource.</p> -<p>La propriété en lecture seule <code><strong>Performance</strong></code><strong><code>.navigation</code></strong> permet d'accéder à un objet de type {{domxref("PerformanceNavigation")}} représentant la navigation qui a lieu dans le contexte courant, par êxemple, le nombre de redirections.</p> +{{warning("Cette propriété n'est pas disponible dans les Web Workers.")}} -<h2 id="Syntax">Syntax</h2> +<h2 id="Syntax">Syntaxe</h2> -<pre class="syntaxbox"><em>navObject</em> = <em>performance</em>.navigation;</pre> +<pre class="brush: js"> + <em>navObject</em> = <em>performance</em>.navigation; +</pre> -<h2 id="Specifications">Specifications</h2> +<h2 id="Specifications">Spécifications</h2> <table class="standard-table"> - <tbody> + <thead> <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> </tr> + </thead> + <tbody> <tr> <td>{{SpecName('Navigation Timing', '#sec-window.performance-attribute', 'Performance.navigation')}}</td> <td>{{Spec2('Navigation Timing')}}</td> - <td>Initial definition.</td> + <td>Définition initiale.</td> </tr> </tbody> </table> -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<div> -<div> - +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> <p>{{Compat("api.Performance.navigation")}}</p> -</div> -</div> -<h2 id="See_also">See also</h2> +<h2 id="See_also">Voir aussi</h2> <ul> - <li>The {{domxref("Performance")}} interface it belongs to.</li> + <li>L'interface {{domxref("Performance")}} à laquelle il appartient.</li> </ul> diff --git a/files/fr/web/api/performance/now/index.html b/files/fr/web/api/performance/now/index.html index 6c325d6d4d..ae539c7f07 100644 --- a/files/fr/web/api/performance/now/index.html +++ b/files/fr/web/api/performance/now/index.html @@ -1,9 +1,10 @@ --- -title: Performance.now() +title: performance.now() slug: Web/API/Performance/now tags: - API - API Performance Web + - Method - Méthode - Performance - Reference @@ -11,67 +12,100 @@ translation_of: Web/API/Performance/now --- <p>{{APIRef("High Resolution Timing")}}</p> -<p>La méthode <code><strong>Performance.now()</strong></code> retourne un {{domxref("DOMHighResTimeStamp")}}, mesuré en millisecondes, avec une précision de 5 millième de milliseconde (5 microsecondes).</p> +<p class="seoSummary">La méthode <code><strong>Performance.now()</strong></code> retourne une valeur de type {{domxref("DOMHighResTimeStamp")}}, mesurée en millisecondes et avec une précision de 5 millièmes de milliseconde (5 microsecondes).</p> -<p> </p> +<p>{{AvailableInWorkers}}</p> -<p>La valeur retournée représente le temps écoulé depuis l'origine de temps.</p> +<p>La valeur retournée représente le temps écoulé depuis le <a href="/fr/docs/Web/API/DOMHighResTimeStamp#the_time_origin">temps d'origine</a>.</p> -<p>Gardez présents à l'esprit les points suivants :</p> +<p>Attention à garder à l'esprit les points suivants :</p> <ul> - <li>Dans les workers dédiés créés à partir d'un contexte {{domxref("Window")}}, la valeur dans le worker sera inférieure à <code>performance.now()</code> dans la fenêtre qui a créé ce worker. C'était auparavant la même chose que le <code>t0</code> du contexte principal, mais cela a été changé.</li> - <li>Dans les workers partagés ou de service, la valeur dans le worker peut être supérieure à celle du contexte principal, car cette fenêtre peut être créée après ces workers.</li> + <li>Dans les workers dédiés créés à partir d'un contexte {{domxref("Window")}}, la valeur dans le worker sera inférieure à celle obtenue par <code>performance.now()</code> exécuté dans la fenêtre ayant créé le worker. La fenêtre et le worker partageaient avant le même temps de référence <code>t0</code> à partir du contexte principal, mais cela a été changé.</li> + <li>Dans les workers partagés ou service sorkers, la valeur dans le worker peut être supérieure à celle du contexte principal, car la fenêtre pourra avoir été créée après ces workers.</li> </ul> -<p> </p> +<p>Il est important de garder à l'esprit que pour atténuer les menaces de sécurité potentielles telles que <a href="https://spectreattack.com/">Spectre</a>, les navigateurs arrondissent généralement la valeur retournée d'une certaine quantité afin d'être moins prévisible. Cela introduit intrinsèquement un degré d'imprécision en limitant la résolution ou la précision de la minuterie. Par exemple, Firefox arrondit le temps renvoyé à des incréments de 1 milliseconde.</p> -<h2 id="Syntaxe">Syntaxe</h2> +<p>La précision de la valeur retournée est susceptible de changer si/quand les problèmes de sécurité sont atténués par d'autres moyens.</p> -<div class="geckoVersionNote"> -<p class="syntaxbox">t = performance.now();</p> -</div> +<h2 id="Syntax">Syntaxe</h2> -<h2 id="Exemple">Exemple</h2> +<pre class="brush: js"> + t = performance.now(); +</pre> + +<h2 id="Example">Exemple</h2> -<pre class="brush: js">var t0 = performance.now(); -faireQuelqueChose(); -var t1 = performance.now(); -console.log("L'appel à faireQuelqueChose a pris " + (t1 - t0) + " millisecondes.") +<pre class="brush: js"> + var t0 = performance.now(); + doSomething(); + var t1 = performance.now(); + console.log("L'appel de doSomething a demandé " + (t1 - t0) + " millisecondes.") </pre> -<p>Contrairement aux autres données de temps disponibles en JavaScript (par exemple <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Date/now" title="/en-US/docs/JavaScript/Reference/Global_Objects/Date/now"><code>Date.now</code></a>), les horodatages retournés par <code>Performance.now()</code> ne sont pas limités à une précision d'une milliseconde. Au contraire, ils représentent les temps comme des nombres flottants avec une précision pouvant aller jusqu'à une microseconde.</p> +<p>Contrairement aux autres données de temps disponibles en JavaScript (par exemple <a href="/fr/docs/Web/JavaScript/Reference/Global_Objects/Date/now"><code>Date.now</code></a>), les horodatages retournés par <code>Performance.now()</code> ne sont pas limités à une précision d'une milliseconde. Au contraire, ils représentent les temps comme des nombres flottants avec une précision pouvant aller jusqu'à une microseconde.</p> + +<p>Également contrairement à <code>Date.now()</code>, les valeurs retournées par <code>Performance.now() </code>sont toujours incrémentées à un taux constant, indépendant de l'horloge du système (qui peut être ajustée manuellement ou par l'intermédiaire d'un logiciel comme NTP). Sinon, <code>performance.timing.navigationStart + performance.now()</code> serait approximativement égal à <code>Date.now().</code></p> + +<h2 id="Reduced_time_precision">Précision réduite du temps</h2> + +<p>Pour offrir une protection contre les attaques de temporisation et les empreintes digitales, la précision de <code>performance.now()</code> peut être arrondie en fonction des paramètres du navigateur. Dans Firefox, la préférence <code>privacy.reduceTimerPrecision</code> est activée par défaut et prend la valeur 1ms par défaut.</p> + +<pre class="brush: js">// précision temporelle réduite (1ms) dans Firefox 60 +performance.now(); +// 8781416 +// 8781815 +// 8782206 +// ... + +// précision du temps réduite avec `privacy.resistFingerprinting` activé +performance.now(); +// 8865400 +// 8866200 +// 8866700 +// ... +</pre> + +<p>Dans Firefox, vous pouvez également activer <code>privacy.resistFingerprinting</code> - cela change la précision à 100ms ou à la valeur de <code>privacy.resistFingerprinting.reduceTimerPrecision.microseconds</code> en fonction de la plus grande des deux.</p> + +<p>À partir de Firefox 79, les minuteurs haute résolution peuvent être utilisés si vous isolez votre document en utilisant les en-têtes {{HTTPHeader("Cross-Origin-Opener-Policy")}} et {{HTTPHeader("Cross-Origin-Embedder-Policy")}} :</p> + +<pre class="brush: plain">Cross-Origin-Opener-Policy: same-origin +Cross-Origin-Embedder-Policy: require-corp</pre> -<p>Également contrairement à <code>Date.now()</code>, les valeurs retournées par <code>Performance.now() </code>sont toujours incrémentées à un taux constant, indépendant de l'horloge du système (qui peut être ajustée manuellement ou par l'intermédiaire d'un logiciel comme NTP). Sinon, <code>performance.timing.navigationStart + performance.now()</code> sera approximativement égal à <code>Date.now().</code></p> +<p>Ces en-têtes garantissent qu'un document de premier niveau ne partage pas un groupe de contexte de navigation avec des documents d'origine croisée. Le processus COOP isole votre document et les attaquants potentiels ne peuvent pas accéder à votre objet global s'ils l'ouvrent dans une fenêtre contextuelle, ce qui permet d'éviter un ensemble d'attaques d'origine croisée appelées <a href="https://github.com/xsleaks/xsleaks">XS-Leaks</a>.</p> -<h2 id="Spécifications">Spécifications</h2> +<h2 id="Specifications">Spécifications</h2> <table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Highres Time Level 2', '#dom-performance-now', 'performance.now()')}}</td> - <td>{{Spec2('Highres Time Level 2')}}</td> - <td>Définitions plus strictes des interfaces et des types.</td> - </tr> - <tr> - <td>{{SpecName('Highres Time', '#dom-performance-now', 'Performance.now()')}}</td> - <td>{{Spec2('Highres Time')}}</td> - <td>Définition initiale</td> - </tr> - </tbody> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Highres Time Level 2', '#dom-performance-now', 'performance.now()')}}</td> + <td>{{Spec2('Highres Time Level 2')}}</td> + <td>Définitions plus strictes des interfaces et des types.</td> + </tr> + <tr> + <td>{{SpecName('Highres Time', '#dom-performance-now', 'Performance.now()')}}</td> + <td>{{Spec2('Highres Time')}}</td> + <td>Définition initiale</td> + </tr> + </tbody> </table> -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> <p>{{Compat("api.Performance.now")}}</p> -<h2 id="Voir_aussi">Voir aussi</h2> +<h2 id="See_also">Voir aussi</h2> <ul> - <li><a href="http://updates.html5rocks.com/2012/08/When-milliseconds-are-not-enough-performance-now" title="http://updates.html5rocks.com/2012/08/When-milliseconds-are-not-enough-performance-now">When milliseconds are not enough: performance.now() </a>de HTML5 Rocks.</li> + <li><a href="http://updates.html5rocks.com/2012/08/When-milliseconds-are-not-enough-performance-now">Quand les millisecondes ne suffisent pas : performance.now() <small>(en)</small></a> de HTML5 Rocks.</li> </ul> diff --git a/files/fr/web/api/performance/onresourcetimingbufferfull/index.html b/files/fr/web/api/performance/onresourcetimingbufferfull/index.html new file mode 100644 index 0000000000..251d9666b9 --- /dev/null +++ b/files/fr/web/api/performance/onresourcetimingbufferfull/index.html @@ -0,0 +1,78 @@ +--- +title: performance.onresourcetimingbufferfull +slug: Web/API/Performance/onresourcetimingbufferfull +tags: +- API +- Method +- Méthode +- Reference +- Performance web +translation_of: Web/API/Performance/onresourcetimingbufferfull +--- +<div>{{APIRef("Resource Timing API")}}</div> + +<p class="seoSummary">La propriété <strong><code>onresourcetimingbufferfull</code></strong> est un gestionnaire d'événements qui sera appelé lorsque l'événement <a href="/fr/docs/Web/API/Performance/resourcetimingbufferfull_event"><code>resourcetimingbufferfull</code></a> est déclenché. Ce déclenchement a lieu lorsque le tampon de performance de synchronisation des ressources du navigateur est plein.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + callback = performance.onresourcetimingbufferfull = buffer_full_cb; +</pre> + +<h3 id="Return_Value">Valeur de retour</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>Un {{domxref("EventHandler")}} qui est invoqué lorsque l'événement <a href="/fr/docs/Web/API/Performance/resourcetimingbufferfull_event"><code>resourcetimingbufferfull</code></a> est déclenché.</dd> +</dl> + +<h2 id="Example">Exemple</h2> + +<p>L'exemple suivant définit une fonction de rappel sur la propriété <code>onresourcetimingbufferfull</code>.</p> + +<pre class="brush: js">function buffer_full(event) { + console.log("WARNING: Resource Timing Buffer is FULL!"); + performance.setResourceTimingBufferSize(200); +} +function init() { + // Définit un rappel si le tampon de ressources est rempli. + performance.onresourcetimingbufferfull = buffer_full; +} +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Resource Timing', '#dom-performance-onresourcetimingbufferfull', + 'onresourcetimingbufferfull')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.onresourcetimingbufferfull")}}</p> + +<h2 id="See_also">Voir aussi</h2> + +<ul> + <li>Événément <a href="/fr/docs/Web/API/Performance/resourcetimingbufferfull_event"><code>resourcetimingbufferfull</code></a></li> + <li>{{domxref("Performance.clearResourceTimings","Performance.clearResourceTimings()")}} + </li> + <li> + {{domxref("Performance.setResourceTimingBufferSize","Performance.setResourceTimingBufferSize()")}} + </li> +</ul> diff --git a/files/fr/web/api/performance/resourcetimingbufferfull_event/index.html b/files/fr/web/api/performance/resourcetimingbufferfull_event/index.html new file mode 100644 index 0000000000..08c648e36d --- /dev/null +++ b/files/fr/web/api/performance/resourcetimingbufferfull_event/index.html @@ -0,0 +1,86 @@ +--- +title: 'Performance : Événement resourcetimingbufferfull' +slug: Web/API/Performance/resourcetimingbufferfull_event +tags: + - API + - DOM + - Event + - Performance + - Reference + - Performance web + - onresourcetimingbufferfull +translation_of: Web/API/Performance/resourcetimingbufferfull_event +--- +<div>{{APIRef}}</div> + +<p class="seoSummary">L'événement <code>resourcetimingbufferfull</code> se déclenche lorsque la mémoire <a href="/fr/docs/Web/API/Performance/setResourceTimingBufferSize">tampon de synchronisation des ressources</a> du navigateur est pleine.</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Propagation</th> + <td>Oui</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Oui</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("Event")}}</td> + </tr> + <tr> + <th scope="row">Propriété pour le gestionnaire d'événements correspondant</th> + <td>{{domxref("Performance.onresourcetimingbufferfull", "onresourcetimingbufferfull")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Examples">Exemples</h2> + +<p>L'exemple suivant définit une fonction de rappel sur la propriété <code>onresourcetimingbufferfull</code>.</p> + +<pre class="brush: js">function buffer_full(event) { + console.log("AVERTISSEMENT : La mémoire tampon des ressources est COMPLÈTE !"); + performance.setResourceTimingBufferSize(200); +} +function init() { + // Définit un rappel si le tampon de ressources est rempli. + performance.onresourcetimingbufferfull = buffer_full; +} +<body onload="init()"></pre> + +<p>Notez que vous pouvez également configurer le gestionnaire à l'aide de la fonction addEventListener() :</p> + +<pre class="brush: js">performance.addEventListener('resourcetimingbufferfull', buffer_full); +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Resource Timing', '#dom-performance-onresourcetimingbufferfull', 'onresourcetimingbufferfull')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td>Définition initialen.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.resourcetimingbufferfull_event")}}</p> + +<h2 id="See_also">Voir aussi</h2> + +<ul> + <li>{{domxref("Performance.clearResourceTimings","Performance.clearResourceTimings()")}}</li> + <li>{{domxref("Performance.setResourceTimingBufferSize","Performance.setResourceTimingBufferSize()")}}</li> +</ul> diff --git a/files/fr/web/api/performance/setresourcetimingbuffersize/index.html b/files/fr/web/api/performance/setresourcetimingbuffersize/index.html new file mode 100644 index 0000000000..2f5d479c31 --- /dev/null +++ b/files/fr/web/api/performance/setresourcetimingbuffersize/index.html @@ -0,0 +1,76 @@ +--- +title: performance.setResourceTimingBufferSize() +slug: Web/API/Performance/setResourceTimingBufferSize +tags: +- API +- Method +- Méthode +- Reference +- Performance web +translation_of: Web/API/Performance/setResourceTimingBufferSize +--- +<div>{{APIRef("Resource Timing API")}}</div> + +<p class="seoSummary">La méthode <strong><code>setResourceTimingBufferSize()</code></strong> définit la taille du tampon mémoire du navigateur dans lequel sont stockés les objets de mesures de performance de type <code>"resource"</code> (voir {{domxref("PerformanceEntry.entryType", "entryType")}}).</p> + +<p>La taille recommandée du tampon de synchronisation des ressources d'un navigateur est au moins 150 objets <code>{{domxref("PerformanceEntry")}}</code>.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + <em>performance</em>.setResourceTimingBufferSize(maxSize); +</pre> + +<h3 id="Arguments">Arguments</h3> + +<dl> + <dt><code>maxSize</code></dt> + <dd>Un nombre (cf. {{jsxref("Number")}}) représentant le nombre maximal d'objets {{domxref("PerformanceEntry", "d'entrée de performance","",1)}} avec le type <code>"resource"</code> que le navigateur doit contenir dans le tampon correspondant.</dd> +</dl> + +<h3 id="Return_Value">Valeur de retour</h3> + +<p>Aucune.</p> + +<h2 id="Example">Exemple</h2> + +<pre class="brush: js">function setResourceTimingBufferSize(maxSize) { + if (performance === undefined) { + log("Le navigateur ne prend pas en charge les performances Web"); + return; + } + var supported = typeof performance.setResourceTimingBufferSize == "function"; + if (supported) { + log("... Performance.setResourceTimingBufferSize() = Oui"); + performance.setResourceTimingBufferSize(maxSize); + } else { + log("... Performance.setResourceTimingBufferSize() = NON pris en charge"); + } +} +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Resource Timing', '#dom-performance-setresourcetimingbuffersize', + 'setResourceTimingBufferSize()')}}</td> + <td>{{Spec2('Resource Timing')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.setResourceTimingBufferSize")}}</p> diff --git a/files/fr/web/api/performance/timeorigin/index.html b/files/fr/web/api/performance/timeorigin/index.html new file mode 100644 index 0000000000..77ab71c3b6 --- /dev/null +++ b/files/fr/web/api/performance/timeorigin/index.html @@ -0,0 +1,50 @@ +--- +title: performance.timeOrigin +slug: Web/API/Performance/timeOrigin +tags: + - API + - Experimental + - High Resolution Time API + - Performance + - Property + - Propriété + - Reference + - timeOrigin +translation_of: Web/API/Performance/getEntriesByName +--- +<p>{{SeeCompatTable}}{{APIRef("High Resolution Time")}}</p> + +<p class="seoSummary">La propriété en lecture seule <strong><code>timeOrigin</code></strong> de l'interface {{domxref("Performance")}} renvoie l'horodatage haute résolution de l'heure de début de la mesure de performance.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + var timeOrigin = performance.timeOrigin +</pre> + +<h3 id="Value">Valeur</h3> + +<p>Un horodatage haute résolution (voir le type <a href="/fr/docs/Web/API/DOMHighResTimeStamp"><code>DOMHighResTimeStamp</code></a>).</p> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Highres Time Level 2','#timeorigin-attribute','timeOrigin')}}</td> + <td>{{Spec2('Highres Time Level 2')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.timeOrigin")}}</p> diff --git a/files/fr/web/api/performance/timing/index.html b/files/fr/web/api/performance/timing/index.html new file mode 100644 index 0000000000..cc26164e41 --- /dev/null +++ b/files/fr/web/api/performance/timing/index.html @@ -0,0 +1,60 @@ +--- +title: performance.timing +slug: Web/API/Performance/timing +tags: + - API + - Rétrocompatibilité + - Déprécié + - Navigation Timing + - Performance + - Property + - Propriété + - Read-only + - Lecture seule + - Reference +translation_of: Web/API/Performance/timing +--- +<p>{{deprecated_header}}{{APIRef("Navigation Timing")}}</p> + +<div class="notecard warning"> + <p>Cette propriété est dépréciée dans la spécification <a href="https://w3c.github.io/navigation-timing/#obsolete">Navigation Timing Level 2</a>. Veuillez utiliser l'interface {{domxref("PerformanceNavigationTiming")}} à la place.</p> +</div> + +<p class="seoSummary">L'ancienne propriété <strong><code>Performance.timing</code></strong> renvoie un objet {{domxref("PerformanceTiming")}} en lecture seule contenant des informations de performance liées à la latence.</p> + +{{warning("Cette propriété n'est pas disponible dans les Web Workers.")}} + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + <var>timingInfo</var> = performance.timing; +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Navigation Timing Level 2', '#obsolete')}}</td> + <td>{{Spec2('Navigation Timing Level 2')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.timing")}}</p> + +<h2 id="See_also">Voir aussi</h2> + +<ul> + <li>L'interface {{domxref("Performance")}} à laquelle il appartient.</li> +</ul> diff --git a/files/fr/web/api/performance/tojson/index.html b/files/fr/web/api/performance/tojson/index.html new file mode 100644 index 0000000000..6cf32a8077 --- /dev/null +++ b/files/fr/web/api/performance/tojson/index.html @@ -0,0 +1,64 @@ +--- +title: performance.toJSON() +slug: Web/API/Performance/toJSON +tags: + - API + - Method + - Méthode + - Performance Web + - Référence +translation_of: Web/API/Performance/toJSON +--- +<div>{{APIRef("High Resolution Timing")}}</div> + +<p class="seoSummary">La méthode <strong><code>toJSON()</code></strong> de l'interface {{domxref("Performance")}} est un sérialiseur standard : elle renvoie une représentation JSON des propriétés de l'objet performance.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntaxe</h2> + +<pre class="brush: js"> + myPerf = performance.toJSON() +</pre> + +<h3 id="Arguments">Arguments</h3> + +<p>Aucun</p> + +<h3 id="Return_value">Valeur de retour</h3> + +<dl> + <dt><code>myPerf</code></dt> + <dd>Un objet JSON qui est la sérialisation de l'objet {{domxref("Performance")}}.</dd> +</dl> + +<h2 id="Example">Exemple</h2> + +<pre class="brush: js">var js; +js = window.performance.toJSON(); +console.log("json = " + JSON.stringify(js)); +</pre> + +<h2 id="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Highres Time Level 2', '#dom-performance-tojson', 'toJSON() + serializer')}}</td> + <td>{{Spec2('Highres Time Level 2')}}</td> + <td>Définition de <code>toJson()</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Performance.toJSON")}}</p> diff --git a/files/fr/web/css/--_star_/index.html b/files/fr/web/css/--_star_/index.html index 9f1c30cbba..8ef049e024 100644 --- a/files/fr/web/css/--_star_/index.html +++ b/files/fr/web/css/--_star_/index.html @@ -31,7 +31,7 @@ translation_of: Web/CSS/--* <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-moz-context-properties/index.html b/files/fr/web/css/-moz-context-properties/index.html index fbb2c9094c..7e0c6fd683 100644 --- a/files/fr/web/css/-moz-context-properties/index.html +++ b/files/fr/web/css/-moz-context-properties/index.html @@ -39,7 +39,7 @@ translation_of: Web/CSS/-moz-context-properties <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-moz-float-edge/index.html b/files/fr/web/css/-moz-float-edge/index.html index 2f6810edae..0d0eed3a7d 100644 --- a/files/fr/web/css/-moz-float-edge/index.html +++ b/files/fr/web/css/-moz-float-edge/index.html @@ -41,7 +41,7 @@ translation_of: Web/CSS/-moz-float-edge <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-moz-force-broken-image-icon/index.html b/files/fr/web/css/-moz-force-broken-image-icon/index.html index 9eebe7361c..df4536f14d 100644 --- a/files/fr/web/css/-moz-force-broken-image-icon/index.html +++ b/files/fr/web/css/-moz-force-broken-image-icon/index.html @@ -25,7 +25,7 @@ translation_of: Web/CSS/-moz-force-broken-image-icon <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-moz-image-rect/index.html b/files/fr/web/css/-moz-image-rect/index.html index e876a8875b..6b496e6303 100644 --- a/files/fr/web/css/-moz-image-rect/index.html +++ b/files/fr/web/css/-moz-image-rect/index.html @@ -37,7 +37,7 @@ translation_of: Web/CSS/-moz-image-rect <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-moz-image-region/index.html b/files/fr/web/css/-moz-image-region/index.html index 603c48f008..b7139034ae 100644 --- a/files/fr/web/css/-moz-image-region/index.html +++ b/files/fr/web/css/-moz-image-region/index.html @@ -42,7 +42,7 @@ translation_of: Web/CSS/-moz-image-region <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-moz-orient/index.html b/files/fr/web/css/-moz-orient/index.html index 80a0b98cbc..167bec69ee 100644 --- a/files/fr/web/css/-moz-orient/index.html +++ b/files/fr/web/css/-moz-orient/index.html @@ -31,7 +31,7 @@ translation_of: Web/CSS/-moz-orient <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-moz-outline-radius/index.html b/files/fr/web/css/-moz-outline-radius/index.html index 60e5e36069..93b64c6fb0 100644 --- a/files/fr/web/css/-moz-outline-radius/index.html +++ b/files/fr/web/css/-moz-outline-radius/index.html @@ -58,7 +58,7 @@ translation_of: Web/CSS/-moz-outline-radius <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-moz-user-focus/index.html b/files/fr/web/css/-moz-user-focus/index.html index 3de08502f7..2fbfc2bbba 100644 --- a/files/fr/web/css/-moz-user-focus/index.html +++ b/files/fr/web/css/-moz-user-focus/index.html @@ -39,7 +39,7 @@ translation_of: Web/CSS/-moz-user-focus <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-moz-user-input/index.html b/files/fr/web/css/-moz-user-input/index.html index e935062db2..699963d390 100644 --- a/files/fr/web/css/-moz-user-input/index.html +++ b/files/fr/web/css/-moz-user-input/index.html @@ -40,7 +40,7 @@ translation_of: Web/CSS/-moz-user-input <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-border-before/index.html b/files/fr/web/css/-webkit-border-before/index.html index 9c99fe83cd..de2450f800 100644 --- a/files/fr/web/css/-webkit-border-before/index.html +++ b/files/fr/web/css/-webkit-border-before/index.html @@ -46,7 +46,7 @@ translation_of: Web/CSS/-webkit-border-before <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-box-reflect/index.html b/files/fr/web/css/-webkit-box-reflect/index.html index 63a8855074..efb2b72500 100644 --- a/files/fr/web/css/-webkit-box-reflect/index.html +++ b/files/fr/web/css/-webkit-box-reflect/index.html @@ -47,7 +47,7 @@ translation_of: Web/CSS/-webkit-box-reflect <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/-webkit-mask-attachment/index.html b/files/fr/web/css/-webkit-mask-attachment/index.html index 30f5caeb13..35d4ca06ee 100644 --- a/files/fr/web/css/-webkit-mask-attachment/index.html +++ b/files/fr/web/css/-webkit-mask-attachment/index.html @@ -40,7 +40,7 @@ translation_of: Web/CSS/-webkit-mask-attachment <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-mask-composite/index.html b/files/fr/web/css/-webkit-mask-composite/index.html index 1acfc7d25d..4582161e1e 100644 --- a/files/fr/web/css/-webkit-mask-composite/index.html +++ b/files/fr/web/css/-webkit-mask-composite/index.html @@ -66,7 +66,7 @@ translation_of: Web/CSS/-webkit-mask-composite <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-mask-position-x/index.html b/files/fr/web/css/-webkit-mask-position-x/index.html index af1b699b8b..590e7e1bc3 100644 --- a/files/fr/web/css/-webkit-mask-position-x/index.html +++ b/files/fr/web/css/-webkit-mask-position-x/index.html @@ -53,7 +53,7 @@ translation_of: Web/CSS/-webkit-mask-position-x <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-mask-position-y/index.html b/files/fr/web/css/-webkit-mask-position-y/index.html index d620e75b1d..2ee6dcd5d7 100644 --- a/files/fr/web/css/-webkit-mask-position-y/index.html +++ b/files/fr/web/css/-webkit-mask-position-y/index.html @@ -55,7 +55,7 @@ translation_of: Web/CSS/-webkit-mask-position-y <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-mask-repeat-x/index.html b/files/fr/web/css/-webkit-mask-repeat-x/index.html index 513d898b57..62743912cf 100644 --- a/files/fr/web/css/-webkit-mask-repeat-x/index.html +++ b/files/fr/web/css/-webkit-mask-repeat-x/index.html @@ -44,8 +44,7 @@ translation_of: Web/CSS/-webkit-mask-repeat-x <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-mask-repeat-y/index.html b/files/fr/web/css/-webkit-mask-repeat-y/index.html index 3c59b32302..6a17c6e763 100644 --- a/files/fr/web/css/-webkit-mask-repeat-y/index.html +++ b/files/fr/web/css/-webkit-mask-repeat-y/index.html @@ -44,8 +44,7 @@ translation_of: Web/CSS/-webkit-mask-repeat-y <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-overflow-scrolling/index.html b/files/fr/web/css/-webkit-overflow-scrolling/index.html index 8a9c9ee4d3..8fcaa2c29d 100644 --- a/files/fr/web/css/-webkit-overflow-scrolling/index.html +++ b/files/fr/web/css/-webkit-overflow-scrolling/index.html @@ -23,7 +23,7 @@ translation_of: Web/CSS/-webkit-overflow-scrolling <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-tap-highlight-color/index.html b/files/fr/web/css/-webkit-tap-highlight-color/index.html index e2abe32c3c..677d4e4be2 100644 --- a/files/fr/web/css/-webkit-tap-highlight-color/index.html +++ b/files/fr/web/css/-webkit-tap-highlight-color/index.html @@ -27,7 +27,7 @@ translation_of: Web/CSS/-webkit-tap-highlight-color <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/-webkit-text-fill-color/index.html b/files/fr/web/css/-webkit-text-fill-color/index.html index 886519717f..6accbfa8a1 100644 --- a/files/fr/web/css/-webkit-text-fill-color/index.html +++ b/files/fr/web/css/-webkit-text-fill-color/index.html @@ -35,7 +35,7 @@ translation_of: Web/CSS/-webkit-text-fill-color <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-text-stroke-color/index.html b/files/fr/web/css/-webkit-text-stroke-color/index.html index fe756244da..6533d15829 100644 --- a/files/fr/web/css/-webkit-text-stroke-color/index.html +++ b/files/fr/web/css/-webkit-text-stroke-color/index.html @@ -37,7 +37,7 @@ translation_of: Web/CSS/-webkit-text-stroke-color <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-text-stroke-width/index.html b/files/fr/web/css/-webkit-text-stroke-width/index.html index 15aa0db12c..cce0dcf150 100644 --- a/files/fr/web/css/-webkit-text-stroke-width/index.html +++ b/files/fr/web/css/-webkit-text-stroke-width/index.html @@ -43,7 +43,7 @@ translation_of: Web/CSS/-webkit-text-stroke-width <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-text-stroke/index.html b/files/fr/web/css/-webkit-text-stroke/index.html index 5ad00e1c52..8f7663724b 100644 --- a/files/fr/web/css/-webkit-text-stroke/index.html +++ b/files/fr/web/css/-webkit-text-stroke/index.html @@ -34,7 +34,7 @@ translation_of: Web/CSS/-webkit-text-stroke <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/-webkit-touch-callout/index.html b/files/fr/web/css/-webkit-touch-callout/index.html index 3e6acd191c..da482feb67 100644 --- a/files/fr/web/css/-webkit-touch-callout/index.html +++ b/files/fr/web/css/-webkit-touch-callout/index.html @@ -36,7 +36,7 @@ translation_of: Web/CSS/-webkit-touch-callout <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@charset/index.html b/files/fr/web/css/@charset/index.html index 9de828ed03..dc968e5ed0 100644 --- a/files/fr/web/css/@charset/index.html +++ b/files/fr/web/css/@charset/index.html @@ -39,8 +39,7 @@ translation_of: Web/CSS/@charset <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/additive-symbols/index.html b/files/fr/web/css/@counter-style/additive-symbols/index.html index 51c9cb0094..8e55de3286 100644 --- a/files/fr/web/css/@counter-style/additive-symbols/index.html +++ b/files/fr/web/css/@counter-style/additive-symbols/index.html @@ -22,7 +22,7 @@ additive-symbols: 3 "0", 2 url(symbol.png); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/fallback/index.html b/files/fr/web/css/@counter-style/fallback/index.html index cf00348402..4fefc34265 100644 --- a/files/fr/web/css/@counter-style/fallback/index.html +++ b/files/fr/web/css/@counter-style/fallback/index.html @@ -25,7 +25,7 @@ fallback: custom-gangnam-style; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/index.html b/files/fr/web/css/@counter-style/index.html index 12dd1653c3..8440948f59 100644 --- a/files/fr/web/css/@counter-style/index.html +++ b/files/fr/web/css/@counter-style/index.html @@ -90,8 +90,7 @@ ul { <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/negative/index.html b/files/fr/web/css/@counter-style/negative/index.html index 375fafa8fb..ee5ba91223 100644 --- a/files/fr/web/css/@counter-style/negative/index.html +++ b/files/fr/web/css/@counter-style/negative/index.html @@ -31,7 +31,7 @@ negative: "(" ")"; /* Entoure la valeur avec '(' et ')' si elle est négative <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/pad/index.html b/files/fr/web/css/@counter-style/pad/index.html index ce73abaeca..fde74a66e6 100644 --- a/files/fr/web/css/@counter-style/pad/index.html +++ b/files/fr/web/css/@counter-style/pad/index.html @@ -32,7 +32,7 @@ translation_of: Web/CSS/@counter-style/pad <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/prefix/index.html b/files/fr/web/css/@counter-style/prefix/index.html index 25de1edd1c..b055d752bf 100644 --- a/files/fr/web/css/@counter-style/prefix/index.html +++ b/files/fr/web/css/@counter-style/prefix/index.html @@ -27,7 +27,7 @@ prefix: "Page"; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/range/index.html b/files/fr/web/css/@counter-style/range/index.html index 92043910dc..2c07422fdb 100644 --- a/files/fr/web/css/@counter-style/range/index.html +++ b/files/fr/web/css/@counter-style/range/index.html @@ -52,7 +52,7 @@ range: infinite 6, 10 infinite; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/speak-as/index.html b/files/fr/web/css/@counter-style/speak-as/index.html index d3a7631b4e..a51c584abe 100644 --- a/files/fr/web/css/@counter-style/speak-as/index.html +++ b/files/fr/web/css/@counter-style/speak-as/index.html @@ -52,7 +52,7 @@ speak-as: <counter-style-name>; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/suffix/index.html b/files/fr/web/css/@counter-style/suffix/index.html index a39b699c0d..79bfb62630 100644 --- a/files/fr/web/css/@counter-style/suffix/index.html +++ b/files/fr/web/css/@counter-style/suffix/index.html @@ -27,7 +27,7 @@ suffix: ") "; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/symbols/index.html b/files/fr/web/css/@counter-style/symbols/index.html index 2440d1a430..2c3be8de24 100644 --- a/files/fr/web/css/@counter-style/symbols/index.html +++ b/files/fr/web/css/@counter-style/symbols/index.html @@ -40,7 +40,7 @@ symbols: indic-numbers; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@counter-style/system/index.html b/files/fr/web/css/@counter-style/system/index.html index 378154364d..8e513340b9 100644 --- a/files/fr/web/css/@counter-style/system/index.html +++ b/files/fr/web/css/@counter-style/system/index.html @@ -67,7 +67,7 @@ system: extends decimal; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@document/index.html b/files/fr/web/css/@document/index.html index 27549052b9..61839819b7 100644 --- a/files/fr/web/css/@document/index.html +++ b/files/fr/web/css/@document/index.html @@ -43,7 +43,7 @@ translation_of: Web/CSS/@document <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-face/font-display/index.html b/files/fr/web/css/@font-face/font-display/index.html index f044ddbc3e..4eb37f1308 100644 --- a/files/fr/web/css/@font-face/font-display/index.html +++ b/files/fr/web/css/@font-face/font-display/index.html @@ -53,7 +53,7 @@ font-display: optional;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-face/font-family/index.html b/files/fr/web/css/@font-face/font-family/index.html index 3d9e1c6717..adff652f71 100644 --- a/files/fr/web/css/@font-face/font-family/index.html +++ b/files/fr/web/css/@font-face/font-family/index.html @@ -31,7 +31,7 @@ font-family: exemplepolice; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-face/font-stretch/index.html b/files/fr/web/css/@font-face/font-stretch/index.html index e7ab910e64..c2ce8b47f4 100644 --- a/files/fr/web/css/@font-face/font-stretch/index.html +++ b/files/fr/web/css/@font-face/font-stretch/index.html @@ -115,8 +115,7 @@ font-stretch: condensed ultra-condensed;; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre>{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-face/font-style/index.html b/files/fr/web/css/@font-face/font-style/index.html index b3265e2d68..4966b73ded 100644 --- a/files/fr/web/css/@font-face/font-style/index.html +++ b/files/fr/web/css/@font-face/font-style/index.html @@ -39,7 +39,7 @@ font-style: oblique 30deg 50deg;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-face/font-variation-settings/index.html b/files/fr/web/css/@font-face/font-variation-settings/index.html index d9dd7e0789..eb815dd804 100644 --- a/files/fr/web/css/@font-face/font-variation-settings/index.html +++ b/files/fr/web/css/@font-face/font-variation-settings/index.html @@ -31,7 +31,7 @@ font-variation-settings: "xhgt" 0.7;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-face/font-weight/index.html b/files/fr/web/css/@font-face/font-weight/index.html index 21fcbc251f..b5fc4b1279 100644 --- a/files/fr/web/css/@font-face/font-weight/index.html +++ b/files/fr/web/css/@font-face/font-weight/index.html @@ -104,8 +104,7 @@ font-weight: 300 500; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre>{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-face/index.html b/files/fr/web/css/@font-face/index.html index 9e55c634fb..551b9d8c3c 100644 --- a/files/fr/web/css/@font-face/index.html +++ b/files/fr/web/css/@font-face/index.html @@ -61,7 +61,7 @@ translation_of: Web/CSS/@font-face <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-face/src/index.html b/files/fr/web/css/@font-face/src/index.html index ff77ace03b..4e97d76f22 100644 --- a/files/fr/web/css/@font-face/src/index.html +++ b/files/fr/web/css/@font-face/src/index.html @@ -48,7 +48,7 @@ src: local(police), url(chemin/vers/police.svg) format("svg"), <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-face/unicode-range/index.html b/files/fr/web/css/@font-face/unicode-range/index.html index e8eec9242d..8b80de9be0 100644 --- a/files/fr/web/css/@font-face/unicode-range/index.html +++ b/files/fr/web/css/@font-face/unicode-range/index.html @@ -50,7 +50,7 @@ unicode-range: U+0025-00FF, U+4??; /* plusieurs valeurs */ <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@font-feature-values/index.html b/files/fr/web/css/@font-feature-values/index.html index 4353939675..62438b6120 100644 --- a/files/fr/web/css/@font-feature-values/index.html +++ b/files/fr/web/css/@font-feature-values/index.html @@ -57,7 +57,7 @@ translation_of: Web/CSS/@font-feature-values <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/@import/index.html b/files/fr/web/css/@import/index.html index 176945cf96..06fd224b05 100644 --- a/files/fr/web/css/@import/index.html +++ b/files/fr/web/css/@import/index.html @@ -38,7 +38,7 @@ translation_of: Web/CSS/@import <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/@keyframes/index.html b/files/fr/web/css/@keyframes/index.html index 70f1d251c6..ce70775989 100644 --- a/files/fr/web/css/@keyframes/index.html +++ b/files/fr/web/css/@keyframes/index.html @@ -92,7 +92,7 @@ translation_of: Web/CSS/@keyframes <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@media/-ms-high-contrast/index.html b/files/fr/web/css/@media/-ms-high-contrast/index.html index 5c9af71a4d..aca491ee04 100644 --- a/files/fr/web/css/@media/-ms-high-contrast/index.html +++ b/files/fr/web/css/@media/-ms-high-contrast/index.html @@ -41,7 +41,7 @@ original_slug: Web/CSS/-ms-high-contrast <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@media/index.html b/files/fr/web/css/@media/index.html index aced40e2b4..79ae890b77 100644 --- a/files/fr/web/css/@media/index.html +++ b/files/fr/web/css/@media/index.html @@ -44,7 +44,7 @@ translation_of: Web/CSS/@media <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Les_caractéristiques_média">Les caractéristiques média</h2> diff --git a/files/fr/web/css/@namespace/index.html b/files/fr/web/css/@namespace/index.html index 60693a85ab..d49dc466d2 100644 --- a/files/fr/web/css/@namespace/index.html +++ b/files/fr/web/css/@namespace/index.html @@ -50,7 +50,7 @@ svg|a {} <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/@page/bleed/index.html b/files/fr/web/css/@page/bleed/index.html index 3ff61db95c..576781614b 100644 --- a/files/fr/web/css/@page/bleed/index.html +++ b/files/fr/web/css/@page/bleed/index.html @@ -34,7 +34,7 @@ bleed: 1cm; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@page/index.html b/files/fr/web/css/@page/index.html index c056ac3ae2..155f99ee93 100644 --- a/files/fr/web/css/@page/index.html +++ b/files/fr/web/css/@page/index.html @@ -44,7 +44,7 @@ translation_of: Web/CSS/@page <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@page/marks/index.html b/files/fr/web/css/@page/marks/index.html index 8ac0d906f5..5b37cfb6ad 100644 --- a/files/fr/web/css/@page/marks/index.html +++ b/files/fr/web/css/@page/marks/index.html @@ -36,7 +36,7 @@ marks: crop cross; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@supports/index.html b/files/fr/web/css/@supports/index.html index 6baf61e27c..670a5a3dd5 100644 --- a/files/fr/web/css/@supports/index.html +++ b/files/fr/web/css/@supports/index.html @@ -104,7 +104,7 @@ translation_of: Web/CSS/@supports <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/@viewport/index.html b/files/fr/web/css/@viewport/index.html index 0269b84e53..ba546ff2da 100644 --- a/files/fr/web/css/@viewport/index.html +++ b/files/fr/web/css/@viewport/index.html @@ -63,7 +63,7 @@ translation_of: Web/CSS/@viewport <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_-moz-only-whitespace/index.html b/files/fr/web/css/_colon_-moz-only-whitespace/index.html index c9f9b7c90a..f02a630c23 100644 --- a/files/fr/web/css/_colon_-moz-only-whitespace/index.html +++ b/files/fr/web/css/_colon_-moz-only-whitespace/index.html @@ -19,7 +19,7 @@ translation_of: 'Web/CSS/:-moz-only-whitespace' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_active/index.html b/files/fr/web/css/_colon_active/index.html index bf8309e0a5..99b9aac4ef 100644 --- a/files/fr/web/css/_colon_active/index.html +++ b/files/fr/web/css/_colon_active/index.html @@ -25,7 +25,7 @@ a:active { <h2 id="Syntax">Syntax</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_any-link/index.html b/files/fr/web/css/_colon_any-link/index.html index 3478e545af..f0b285c330 100644 --- a/files/fr/web/css/_colon_any-link/index.html +++ b/files/fr/web/css/_colon_any-link/index.html @@ -21,8 +21,7 @@ translation_of: 'Web/CSS/:any-link' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_blank/index.html b/files/fr/web/css/_colon_blank/index.html index 78f5f10739..6202668c57 100644 --- a/files/fr/web/css/_colon_blank/index.html +++ b/files/fr/web/css/_colon_blank/index.html @@ -19,7 +19,7 @@ translation_of: 'Web/CSS/:blank' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/_colon_checked/index.html b/files/fr/web/css/_colon_checked/index.html index 1c30f76b91..c5d4930ce3 100644 --- a/files/fr/web/css/_colon_checked/index.html +++ b/files/fr/web/css/_colon_checked/index.html @@ -25,8 +25,7 @@ input:checked { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_default/index.html b/files/fr/web/css/_colon_default/index.html index 6dbe175935..fbe365108d 100644 --- a/files/fr/web/css/_colon_default/index.html +++ b/files/fr/web/css/_colon_default/index.html @@ -34,8 +34,7 @@ translation_of: 'Web/CSS/:default' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_defined/index.html b/files/fr/web/css/_colon_defined/index.html index 9bdc667302..7865bca86e 100644 --- a/files/fr/web/css/_colon_defined/index.html +++ b/files/fr/web/css/_colon_defined/index.html @@ -26,7 +26,7 @@ simple-custom:defined { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_dir/index.html b/files/fr/web/css/_colon_dir/index.html index 7d9197910e..0a6d8e713e 100644 --- a/files/fr/web/css/_colon_dir/index.html +++ b/files/fr/web/css/_colon_dir/index.html @@ -34,7 +34,7 @@ translation_of: 'Web/CSS/:dir' <dt> <h3 id="Syntaxe_formelle_2">Syntaxe formelle</h3> - <pre class="syntaxbox">{{csssyntax}}</pre> + {{csssyntax}} </dt> </dl> diff --git a/files/fr/web/css/_colon_disabled/index.html b/files/fr/web/css/_colon_disabled/index.html index 8c7e609d58..e8350260d6 100644 --- a/files/fr/web/css/_colon_disabled/index.html +++ b/files/fr/web/css/_colon_disabled/index.html @@ -19,7 +19,7 @@ input[type="text"]:disabled { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_empty/index.html b/files/fr/web/css/_colon_empty/index.html index ef31669639..9bdbfb1608 100644 --- a/files/fr/web/css/_colon_empty/index.html +++ b/files/fr/web/css/_colon_empty/index.html @@ -23,8 +23,7 @@ div:empty { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_enabled/index.html b/files/fr/web/css/_colon_enabled/index.html index 7fdc81910f..b6b01317ec 100644 --- a/files/fr/web/css/_colon_enabled/index.html +++ b/files/fr/web/css/_colon_enabled/index.html @@ -18,7 +18,7 @@ input:enabled { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_first-child/index.html b/files/fr/web/css/_colon_first-child/index.html index 508a65a4de..993d826815 100644 --- a/files/fr/web/css/_colon_first-child/index.html +++ b/files/fr/web/css/_colon_first-child/index.html @@ -24,8 +24,7 @@ p:first-child { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_first-of-type/index.html b/files/fr/web/css/_colon_first-of-type/index.html index 7739d63fd4..441cd2925b 100644 --- a/files/fr/web/css/_colon_first-of-type/index.html +++ b/files/fr/web/css/_colon_first-of-type/index.html @@ -23,8 +23,7 @@ p:first-of-type { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_first/index.html b/files/fr/web/css/_colon_first/index.html index 336d6c6fad..0177080c67 100644 --- a/files/fr/web/css/_colon_first/index.html +++ b/files/fr/web/css/_colon_first/index.html @@ -30,7 +30,7 @@ translation_of: 'Web/CSS/:first' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_focus-within/index.html b/files/fr/web/css/_colon_focus-within/index.html index bb01fcfbf5..c1113653fb 100644 --- a/files/fr/web/css/_colon_focus-within/index.html +++ b/files/fr/web/css/_colon_focus-within/index.html @@ -23,7 +23,7 @@ div:focus-within { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_focus/index.html b/files/fr/web/css/_colon_focus/index.html index 894676ea2f..90371d4e8e 100644 --- a/files/fr/web/css/_colon_focus/index.html +++ b/files/fr/web/css/_colon_focus/index.html @@ -21,7 +21,7 @@ input:focus { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_fullscreen/index.html b/files/fr/web/css/_colon_fullscreen/index.html index 48f221600c..4e02dd512c 100644 --- a/files/fr/web/css/_colon_fullscreen/index.html +++ b/files/fr/web/css/_colon_fullscreen/index.html @@ -14,7 +14,7 @@ translation_of: 'Web/CSS/:fullscreen' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Notes_dutilisation">Notes d'utilisation</h2> diff --git a/files/fr/web/css/_colon_host()/index.html b/files/fr/web/css/_colon_host()/index.html index 0d8b083548..4ba484cbd5 100644 --- a/files/fr/web/css/_colon_host()/index.html +++ b/files/fr/web/css/_colon_host()/index.html @@ -26,7 +26,7 @@ translation_of: 'Web/CSS/:host()' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_host-context()/index.html b/files/fr/web/css/_colon_host-context()/index.html index 36bcacd731..ddcdb9a5fb 100644 --- a/files/fr/web/css/_colon_host-context()/index.html +++ b/files/fr/web/css/_colon_host-context()/index.html @@ -33,7 +33,7 @@ translation_of: 'Web/CSS/:host-context()' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_host/index.html b/files/fr/web/css/_colon_host/index.html index c82bb211e4..68de8a8204 100644 --- a/files/fr/web/css/_colon_host/index.html +++ b/files/fr/web/css/_colon_host/index.html @@ -23,7 +23,7 @@ translation_of: 'Web/CSS/:host' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_hover/index.html b/files/fr/web/css/_colon_hover/index.html index 93419ae333..7300e69892 100644 --- a/files/fr/web/css/_colon_hover/index.html +++ b/files/fr/web/css/_colon_hover/index.html @@ -25,7 +25,7 @@ a:hover { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_in-range/index.html b/files/fr/web/css/_colon_in-range/index.html index 3e5e8ff1b4..ad3aef1496 100644 --- a/files/fr/web/css/_colon_in-range/index.html +++ b/files/fr/web/css/_colon_in-range/index.html @@ -24,7 +24,7 @@ input:in-range { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_indeterminate/index.html b/files/fr/web/css/_colon_indeterminate/index.html index 5ebd9cd85e..98a10ed83c 100644 --- a/files/fr/web/css/_colon_indeterminate/index.html +++ b/files/fr/web/css/_colon_indeterminate/index.html @@ -27,7 +27,7 @@ input:indeterminate { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_invalid/index.html b/files/fr/web/css/_colon_invalid/index.html index 6b571b7d18..58a9533d82 100644 --- a/files/fr/web/css/_colon_invalid/index.html +++ b/files/fr/web/css/_colon_invalid/index.html @@ -20,7 +20,7 @@ input:invalid { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/_colon_is/index.html b/files/fr/web/css/_colon_is/index.html index 0e30e8c34a..cee3a3ae09 100644 --- a/files/fr/web/css/_colon_is/index.html +++ b/files/fr/web/css/_colon_is/index.html @@ -53,7 +53,7 @@ footer p:hover { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_lang/index.html b/files/fr/web/css/_colon_lang/index.html index 0d4b2d406a..e76c752921 100644 --- a/files/fr/web/css/_colon_lang/index.html +++ b/files/fr/web/css/_colon_lang/index.html @@ -27,7 +27,7 @@ p:lang(en) { <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h3 id="Paramètre">Paramètre</h3> diff --git a/files/fr/web/css/_colon_last-child/index.html b/files/fr/web/css/_colon_last-child/index.html index a8ef3b516b..fa9ff5a07f 100644 --- a/files/fr/web/css/_colon_last-child/index.html +++ b/files/fr/web/css/_colon_last-child/index.html @@ -24,7 +24,7 @@ li:last-child { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_last-of-type/index.html b/files/fr/web/css/_colon_last-of-type/index.html index 618d0fa6a4..5252738aa9 100644 --- a/files/fr/web/css/_colon_last-of-type/index.html +++ b/files/fr/web/css/_colon_last-of-type/index.html @@ -23,7 +23,7 @@ p:last-of-type { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_left/index.html b/files/fr/web/css/_colon_left/index.html index 9af8051ca3..51a8bbdf80 100644 --- a/files/fr/web/css/_colon_left/index.html +++ b/files/fr/web/css/_colon_left/index.html @@ -24,7 +24,7 @@ translation_of: 'Web/CSS/:left' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_link/index.html b/files/fr/web/css/_colon_link/index.html index 9d1f128702..5c8da26ad4 100644 --- a/files/fr/web/css/_colon_link/index.html +++ b/files/fr/web/css/_colon_link/index.html @@ -25,7 +25,7 @@ a:link { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_not/index.html b/files/fr/web/css/_colon_not/index.html index 7720f1c178..8db83d2d00 100644 --- a/files/fr/web/css/_colon_not/index.html +++ b/files/fr/web/css/_colon_not/index.html @@ -38,7 +38,7 @@ translation_of: 'Web/CSS/:not' <p><strong>Attention</strong>, la possibilité d'avoir plusieurs sélecteurs est expérimentale et n'est pas encore largement prise en charge.</p> </div> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_nth-child/index.html b/files/fr/web/css/_colon_nth-child/index.html index b9826680e8..668fcbefe0 100644 --- a/files/fr/web/css/_colon_nth-child/index.html +++ b/files/fr/web/css/_colon_nth-child/index.html @@ -58,7 +58,7 @@ body :nth-child(4n) { <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_nth-last-child/index.html b/files/fr/web/css/_colon_nth-last-child/index.html index 16c0e524ef..eba1693bbe 100644 --- a/files/fr/web/css/_colon_nth-last-child/index.html +++ b/files/fr/web/css/_colon_nth-last-child/index.html @@ -41,7 +41,7 @@ body: nth-last-child(4n) { <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_nth-last-of-type/index.html b/files/fr/web/css/_colon_nth-last-of-type/index.html index f8689c04d1..58c0ff5038 100644 --- a/files/fr/web/css/_colon_nth-last-of-type/index.html +++ b/files/fr/web/css/_colon_nth-last-of-type/index.html @@ -26,7 +26,7 @@ div:nth-last-of-type(4n) { <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_nth-of-type/index.html b/files/fr/web/css/_colon_nth-of-type/index.html index ab51994aec..ff659f085c 100644 --- a/files/fr/web/css/_colon_nth-of-type/index.html +++ b/files/fr/web/css/_colon_nth-of-type/index.html @@ -29,7 +29,7 @@ p:nth-of-type(4n) { <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_only-child/index.html b/files/fr/web/css/_colon_only-child/index.html index 2ad2d86c12..ee2a74c4cc 100644 --- a/files/fr/web/css/_colon_only-child/index.html +++ b/files/fr/web/css/_colon_only-child/index.html @@ -23,7 +23,7 @@ p:only-child { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_only-of-type/index.html b/files/fr/web/css/_colon_only-of-type/index.html index d60cf898db..202b02773c 100644 --- a/files/fr/web/css/_colon_only-of-type/index.html +++ b/files/fr/web/css/_colon_only-of-type/index.html @@ -24,7 +24,7 @@ p:only-of-type { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_optional/index.html b/files/fr/web/css/_colon_optional/index.html index 26ec7e5506..86e7778a3c 100644 --- a/files/fr/web/css/_colon_optional/index.html +++ b/files/fr/web/css/_colon_optional/index.html @@ -23,7 +23,7 @@ input:optional { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_out-of-range/index.html b/files/fr/web/css/_colon_out-of-range/index.html index ff99fb7c26..ad902ffc30 100644 --- a/files/fr/web/css/_colon_out-of-range/index.html +++ b/files/fr/web/css/_colon_out-of-range/index.html @@ -22,7 +22,7 @@ input:out-of-range { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_placeholder-shown/index.html b/files/fr/web/css/_colon_placeholder-shown/index.html index 943598fde4..94f6b8aae7 100644 --- a/files/fr/web/css/_colon_placeholder-shown/index.html +++ b/files/fr/web/css/_colon_placeholder-shown/index.html @@ -19,7 +19,7 @@ translation_of: 'Web/CSS/:placeholder-shown' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_read-only/index.html b/files/fr/web/css/_colon_read-only/index.html index d8d7183237..e5be8bfdd3 100644 --- a/files/fr/web/css/_colon_read-only/index.html +++ b/files/fr/web/css/_colon_read-only/index.html @@ -30,7 +30,7 @@ input:read-only { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_read-write/index.html b/files/fr/web/css/_colon_read-write/index.html index d867eaee4e..23be40d145 100644 --- a/files/fr/web/css/_colon_read-write/index.html +++ b/files/fr/web/css/_colon_read-write/index.html @@ -28,7 +28,7 @@ input:read-write { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_required/index.html b/files/fr/web/css/_colon_required/index.html index f2fcdc5366..3e4eea2d44 100644 --- a/files/fr/web/css/_colon_required/index.html +++ b/files/fr/web/css/_colon_required/index.html @@ -23,7 +23,7 @@ input:required { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_right/index.html b/files/fr/web/css/_colon_right/index.html index 239d2171f9..853974ee27 100644 --- a/files/fr/web/css/_colon_right/index.html +++ b/files/fr/web/css/_colon_right/index.html @@ -23,7 +23,7 @@ translation_of: 'Web/CSS/:right' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_root/index.html b/files/fr/web/css/_colon_root/index.html index cdfe0ca96f..24db0a677c 100644 --- a/files/fr/web/css/_colon_root/index.html +++ b/files/fr/web/css/_colon_root/index.html @@ -19,7 +19,7 @@ translation_of: 'Web/CSS/:root' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_scope/index.html b/files/fr/web/css/_colon_scope/index.html index eba58021b7..28e628b0b8 100644 --- a/files/fr/web/css/_colon_scope/index.html +++ b/files/fr/web/css/_colon_scope/index.html @@ -21,7 +21,7 @@ translation_of: 'Web/CSS/:scope' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_target/index.html b/files/fr/web/css/_colon_target/index.html index bba7c3b8b3..ec5d533df3 100644 --- a/files/fr/web/css/_colon_target/index.html +++ b/files/fr/web/css/_colon_target/index.html @@ -29,7 +29,7 @@ translation_of: 'Web/CSS/:target' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_user-invalid/index.html b/files/fr/web/css/_colon_user-invalid/index.html index 50493e4491..68249bdbb6 100644 --- a/files/fr/web/css/_colon_user-invalid/index.html +++ b/files/fr/web/css/_colon_user-invalid/index.html @@ -28,7 +28,7 @@ original_slug: Web/CSS/:-moz-ui-invalid <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/_colon_valid/index.html b/files/fr/web/css/_colon_valid/index.html index 5a37129d22..7a70a6b4b3 100644 --- a/files/fr/web/css/_colon_valid/index.html +++ b/files/fr/web/css/_colon_valid/index.html @@ -17,7 +17,7 @@ translation_of: 'Web/CSS/:valid' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_visited/index.html b/files/fr/web/css/_colon_visited/index.html index 5d54e0de21..30bda136dd 100644 --- a/files/fr/web/css/_colon_visited/index.html +++ b/files/fr/web/css/_colon_visited/index.html @@ -32,7 +32,7 @@ translation_of: 'Web/CSS/:visited' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_colon_where/index.html b/files/fr/web/css/_colon_where/index.html index 7b1eac9461..363225a5a4 100644 --- a/files/fr/web/css/_colon_where/index.html +++ b/files/fr/web/css/_colon_where/index.html @@ -17,7 +17,7 @@ translation_of: 'Web/CSS/:where' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/_doublecolon_-moz-color-swatch/index.html b/files/fr/web/css/_doublecolon_-moz-color-swatch/index.html index c2555bb941..8a5d2a1970 100644 --- a/files/fr/web/css/_doublecolon_-moz-color-swatch/index.html +++ b/files/fr/web/css/_doublecolon_-moz-color-swatch/index.html @@ -18,7 +18,7 @@ translation_of: 'Web/CSS/::-moz-color-swatch' <h2 id="Syntax">Syntax</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_-moz-page-sequence/index.html b/files/fr/web/css/_doublecolon_-moz-page-sequence/index.html index 1176bd6b65..e483113da2 100644 --- a/files/fr/web/css/_doublecolon_-moz-page-sequence/index.html +++ b/files/fr/web/css/_doublecolon_-moz-page-sequence/index.html @@ -14,7 +14,7 @@ translation_of: 'Web/CSS/::-moz-page-sequence' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/_doublecolon_-moz-page/index.html b/files/fr/web/css/_doublecolon_-moz-page/index.html index b5a265403d..3ec076b696 100644 --- a/files/fr/web/css/_doublecolon_-moz-page/index.html +++ b/files/fr/web/css/_doublecolon_-moz-page/index.html @@ -14,7 +14,7 @@ translation_of: 'Web/CSS/::-moz-page' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/_doublecolon_-moz-progress-bar/index.html b/files/fr/web/css/_doublecolon_-moz-progress-bar/index.html index bd587d7c2e..a6817d1f5c 100644 --- a/files/fr/web/css/_doublecolon_-moz-progress-bar/index.html +++ b/files/fr/web/css/_doublecolon_-moz-progress-bar/index.html @@ -14,7 +14,7 @@ translation_of: 'Web/CSS/::-moz-progress-bar' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_-moz-range-progress/index.html b/files/fr/web/css/_doublecolon_-moz-range-progress/index.html index 4d7787f37a..38d91ae31e 100644 --- a/files/fr/web/css/_doublecolon_-moz-range-progress/index.html +++ b/files/fr/web/css/_doublecolon_-moz-range-progress/index.html @@ -18,7 +18,7 @@ translation_of: 'Web/CSS/::-moz-range-progress' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_-moz-range-thumb/index.html b/files/fr/web/css/_doublecolon_-moz-range-thumb/index.html index a66f6a3d83..f287273bfc 100644 --- a/files/fr/web/css/_doublecolon_-moz-range-thumb/index.html +++ b/files/fr/web/css/_doublecolon_-moz-range-thumb/index.html @@ -18,7 +18,7 @@ translation_of: 'Web/CSS/::-moz-range-thumb' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_-moz-range-track/index.html b/files/fr/web/css/_doublecolon_-moz-range-track/index.html index 5021c16237..b332824f20 100644 --- a/files/fr/web/css/_doublecolon_-moz-range-track/index.html +++ b/files/fr/web/css/_doublecolon_-moz-range-track/index.html @@ -18,7 +18,7 @@ translation_of: 'Web/CSS/::-moz-range-track' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_-moz-scrolled-page-sequence/index.html b/files/fr/web/css/_doublecolon_-moz-scrolled-page-sequence/index.html index 688f8a5a50..9314ce1796 100644 --- a/files/fr/web/css/_doublecolon_-moz-scrolled-page-sequence/index.html +++ b/files/fr/web/css/_doublecolon_-moz-scrolled-page-sequence/index.html @@ -14,7 +14,7 @@ translation_of: 'Web/CSS/::-moz-scrolled-page-sequence' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/_doublecolon_-webkit-scrollbar/index.html b/files/fr/web/css/_doublecolon_-webkit-scrollbar/index.html index 45d4fff49e..54bebe9657 100644 --- a/files/fr/web/css/_doublecolon_-webkit-scrollbar/index.html +++ b/files/fr/web/css/_doublecolon_-webkit-scrollbar/index.html @@ -14,8 +14,7 @@ translation_of: 'Web/CSS/::-webkit-scrollbar' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}} -</pre> +{{CSSSyntax}} <h2 id="Sélecteurs_de_scrollbars">Sélecteurs de <em>scrollbars</em></h2> diff --git a/files/fr/web/css/_doublecolon_after/index.html b/files/fr/web/css/_doublecolon_after/index.html index 7aa9760fa6..d3243fdb26 100644 --- a/files/fr/web/css/_doublecolon_after/index.html +++ b/files/fr/web/css/_doublecolon_after/index.html @@ -24,7 +24,7 @@ a:after { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <div class="note"> <p><strong>Note :</strong> CSS3 a introduit la notation <code>::after</code> (avec deux deux-points) pour distinguer les <a href="/fr/docs/Web/CSS/Pseudo-classes">pseudo-classes</a> des <a href="/fr/docs/Web/CSS/Pseudo-éléments">pseudo-éléments</a>. Les navigateurs acceptent aussi<code>:after</code>, introduite dans CSS2.</p> diff --git a/files/fr/web/css/_doublecolon_backdrop/index.html b/files/fr/web/css/_doublecolon_backdrop/index.html index feb1775822..4c691d78f7 100644 --- a/files/fr/web/css/_doublecolon_backdrop/index.html +++ b/files/fr/web/css/_doublecolon_backdrop/index.html @@ -25,7 +25,7 @@ dialog::backdrop { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_before/index.html b/files/fr/web/css/_doublecolon_before/index.html index 4e30107c80..e58c2f29e4 100644 --- a/files/fr/web/css/_doublecolon_before/index.html +++ b/files/fr/web/css/_doublecolon_before/index.html @@ -23,8 +23,7 @@ a::before { <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox notranslate">{{csssyntax}} -</pre> +{{csssyntax}} <p>La notation <code>::before</code> a été introduite par CSS 3 pour différencier les <a href="/fr/docs/Web/CSS/Pseudo-classes">pseudo-classes</a> et les <a href="/fr/docs/Web/CSS/Pseudo-éléments">pseudo-éléments</a>. Les navigateurs acceptent aussi la notation <code>:before </code>introduite par CSS 2.</p> diff --git a/files/fr/web/css/_doublecolon_cue-region/index.html b/files/fr/web/css/_doublecolon_cue-region/index.html index 185f78c396..f9979ba898 100644 --- a/files/fr/web/css/_doublecolon_cue-region/index.html +++ b/files/fr/web/css/_doublecolon_cue-region/index.html @@ -40,7 +40,7 @@ translation_of: 'Web/CSS/::cue-region' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_cue/index.html b/files/fr/web/css/_doublecolon_cue/index.html index 7afc17e42c..48dbf55093 100644 --- a/files/fr/web/css/_doublecolon_cue/index.html +++ b/files/fr/web/css/_doublecolon_cue/index.html @@ -40,7 +40,7 @@ translation_of: 'Web/CSS/::cue' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_first-letter/index.html b/files/fr/web/css/_doublecolon_first-letter/index.html index be24b0b651..5dafa276e4 100644 --- a/files/fr/web/css/_doublecolon_first-letter/index.html +++ b/files/fr/web/css/_doublecolon_first-letter/index.html @@ -52,7 +52,7 @@ Si les navigateurs anciens doivent être supportés, <code>:first-letter</code> <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_first-line/index.html b/files/fr/web/css/_doublecolon_first-line/index.html index 55e30bf773..a663aec627 100644 --- a/files/fr/web/css/_doublecolon_first-line/index.html +++ b/files/fr/web/css/_doublecolon_first-line/index.html @@ -42,7 +42,7 @@ Si les navigateurs anciens doivent être supportés, <code>:first-line</code> es <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_marker/index.html b/files/fr/web/css/_doublecolon_marker/index.html index 53b3fc1fe5..6ab6ddd484 100644 --- a/files/fr/web/css/_doublecolon_marker/index.html +++ b/files/fr/web/css/_doublecolon_marker/index.html @@ -34,8 +34,7 @@ translation_of: 'Web/CSS/::marker' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}} -</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_part/index.html b/files/fr/web/css/_doublecolon_part/index.html index 2d966e1fc8..87f4e89ae3 100644 --- a/files/fr/web/css/_doublecolon_part/index.html +++ b/files/fr/web/css/_doublecolon_part/index.html @@ -23,7 +23,7 @@ translation_of: 'Web/CSS/::part' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_placeholder/index.html b/files/fr/web/css/_doublecolon_placeholder/index.html index 70ba6c1830..acce443590 100644 --- a/files/fr/web/css/_doublecolon_placeholder/index.html +++ b/files/fr/web/css/_doublecolon_placeholder/index.html @@ -32,7 +32,7 @@ translation_of: 'Web/CSS/::placeholder' <h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/_doublecolon_slotted/index.html b/files/fr/web/css/_doublecolon_slotted/index.html index 503d42dbf9..56194f9441 100644 --- a/files/fr/web/css/_doublecolon_slotted/index.html +++ b/files/fr/web/css/_doublecolon_slotted/index.html @@ -27,7 +27,7 @@ translation_of: 'Web/CSS/::slotted' <h2 id="Syntax">Syntax</h2> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/align-content/index.html b/files/fr/web/css/align-content/index.html index 4bbae606f4..5f7c5cd2d3 100644 --- a/files/fr/web/css/align-content/index.html +++ b/files/fr/web/css/align-content/index.html @@ -96,8 +96,7 @@ align-content: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/align-items/index.html b/files/fr/web/css/align-items/index.html index 39477147fe..ac23e630f2 100644 --- a/files/fr/web/css/align-items/index.html +++ b/files/fr/web/css/align-items/index.html @@ -97,8 +97,7 @@ align-items: unset; </dt> </dl> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/align-self/index.html b/files/fr/web/css/align-self/index.html index 51ac0143a4..ef825f0867 100644 --- a/files/fr/web/css/align-self/index.html +++ b/files/fr/web/css/align-self/index.html @@ -91,7 +91,7 @@ align-self: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h3 id="CSS">CSS</h3> diff --git a/files/fr/web/css/all/index.html b/files/fr/web/css/all/index.html index b9ed504c85..c1ac14d50c 100644 --- a/files/fr/web/css/all/index.html +++ b/files/fr/web/css/all/index.html @@ -52,7 +52,7 @@ all: revert; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/animation-delay/index.html b/files/fr/web/css/animation-delay/index.html index 8518ef21ce..509932acec 100644 --- a/files/fr/web/css/animation-delay/index.html +++ b/files/fr/web/css/animation-delay/index.html @@ -40,8 +40,7 @@ animation-delay: 2s, 4ms; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/animation-direction/index.html b/files/fr/web/css/animation-direction/index.html index ff6036363e..9bf290d29a 100644 --- a/files/fr/web/css/animation-direction/index.html +++ b/files/fr/web/css/animation-direction/index.html @@ -54,7 +54,7 @@ animation-direction: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/animation-duration/index.html b/files/fr/web/css/animation-duration/index.html index 92edb9d4b5..4c67410b7f 100644 --- a/files/fr/web/css/animation-duration/index.html +++ b/files/fr/web/css/animation-duration/index.html @@ -40,7 +40,7 @@ animation-duration: 10s, 30s, 230ms; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/animation-fill-mode/index.html b/files/fr/web/css/animation-fill-mode/index.html index 415bb13bcd..b6a2e50d79 100644 --- a/files/fr/web/css/animation-fill-mode/index.html +++ b/files/fr/web/css/animation-fill-mode/index.html @@ -108,8 +108,7 @@ animation-fill-mode: both, forwards, none; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/animation-iteration-count/index.html b/files/fr/web/css/animation-iteration-count/index.html index 1a1cf04a69..7563c19e2f 100644 --- a/files/fr/web/css/animation-iteration-count/index.html +++ b/files/fr/web/css/animation-iteration-count/index.html @@ -50,7 +50,7 @@ animation-iteration-count: 2, 0, infinite; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/animation-name/index.html b/files/fr/web/css/animation-name/index.html index 69f6f7c251..d3fff953db 100644 --- a/files/fr/web/css/animation-name/index.html +++ b/files/fr/web/css/animation-name/index.html @@ -49,7 +49,7 @@ animation-name: unset <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/animation-play-state/index.html b/files/fr/web/css/animation-play-state/index.html index 0de85d6f86..dd967513d8 100644 --- a/files/fr/web/css/animation-play-state/index.html +++ b/files/fr/web/css/animation-play-state/index.html @@ -48,8 +48,7 @@ animation-play-state: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/animation-timing-function/index.html b/files/fr/web/css/animation-timing-function/index.html index 28b84d89a9..d447fe3624 100644 --- a/files/fr/web/css/animation-timing-function/index.html +++ b/files/fr/web/css/animation-timing-function/index.html @@ -104,7 +104,7 @@ animation-timing-function: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/animation/index.html b/files/fr/web/css/animation/index.html index e92552e690..16f8f362bd 100644 --- a/files/fr/web/css/animation/index.html +++ b/files/fr/web/css/animation/index.html @@ -256,7 +256,7 @@ button.restart { <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/appearance/index.html b/files/fr/web/css/appearance/index.html index a8bc485e09..feb8aad1be 100644 --- a/files/fr/web/css/appearance/index.html +++ b/files/fr/web/css/appearance/index.html @@ -2628,7 +2628,7 @@ div{ color: black; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/attr()/index.html b/files/fr/web/css/attr()/index.html index 5fcae4a665..909bb70f11 100644 --- a/files/fr/web/css/attr()/index.html +++ b/files/fr/web/css/attr()/index.html @@ -160,7 +160,7 @@ attr(data-something, "default"); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/attribute_selectors/index.html b/files/fr/web/css/attribute_selectors/index.html index ebaeb1dc5d..7163542a59 100644 --- a/files/fr/web/css/attribute_selectors/index.html +++ b/files/fr/web/css/attribute_selectors/index.html @@ -65,7 +65,7 @@ a[class~="logo"] { <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/backdrop-filter/index.html b/files/fr/web/css/backdrop-filter/index.html index a84b25a18e..0c1a3bf4ce 100644 --- a/files/fr/web/css/backdrop-filter/index.html +++ b/files/fr/web/css/backdrop-filter/index.html @@ -54,7 +54,7 @@ backdrop-filter: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/backface-visibility/index.html b/files/fr/web/css/backface-visibility/index.html index 66ebec410a..20eac0df5f 100644 --- a/files/fr/web/css/backface-visibility/index.html +++ b/files/fr/web/css/backface-visibility/index.html @@ -44,7 +44,7 @@ backface-visibility: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/background-attachment/index.html b/files/fr/web/css/background-attachment/index.html index 05febc28f8..df45d9f923 100644 --- a/files/fr/web/css/background-attachment/index.html +++ b/files/fr/web/css/background-attachment/index.html @@ -43,8 +43,7 @@ background-attachment: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/background-clip/index.html b/files/fr/web/css/background-clip/index.html index 9b8e6c5426..0ab697e961 100644 --- a/files/fr/web/css/background-clip/index.html +++ b/files/fr/web/css/background-clip/index.html @@ -46,7 +46,7 @@ background-clip: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/background-color/index.html b/files/fr/web/css/background-color/index.html index 06f072c36e..2829ad7f38 100644 --- a/files/fr/web/css/background-color/index.html +++ b/files/fr/web/css/background-color/index.html @@ -60,7 +60,7 @@ background-color: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/background-image/index.html b/files/fr/web/css/background-image/index.html index 25d4f59de3..4e23ecb4ac 100644 --- a/files/fr/web/css/background-image/index.html +++ b/files/fr/web/css/background-image/index.html @@ -58,8 +58,7 @@ background-image: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/background-origin/index.html b/files/fr/web/css/background-origin/index.html index e43076730c..25c8f51ed3 100644 --- a/files/fr/web/css/background-origin/index.html +++ b/files/fr/web/css/background-origin/index.html @@ -45,7 +45,7 @@ background-origin: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/background-position-x/index.html b/files/fr/web/css/background-position-x/index.html index b80a85a4da..b6459a1c58 100644 --- a/files/fr/web/css/background-position-x/index.html +++ b/files/fr/web/css/background-position-x/index.html @@ -68,7 +68,7 @@ background-position-x: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/background-position-y/index.html b/files/fr/web/css/background-position-y/index.html index f7cb19173f..44ba0038f7 100644 --- a/files/fr/web/css/background-position-y/index.html +++ b/files/fr/web/css/background-position-y/index.html @@ -67,7 +67,7 @@ background-position-y: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/background-position/index.html b/files/fr/web/css/background-position/index.html index 106dc30a38..09f038edd9 100644 --- a/files/fr/web/css/background-position/index.html +++ b/files/fr/web/css/background-position/index.html @@ -94,7 +94,7 @@ background-position: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/background-repeat/index.html b/files/fr/web/css/background-repeat/index.html index de3634fb94..567bf4bf16 100644 --- a/files/fr/web/css/background-repeat/index.html +++ b/files/fr/web/css/background-repeat/index.html @@ -106,8 +106,7 @@ background-repeat: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> @@ -152,7 +151,7 @@ div { /* Plusieurs images */ .seven { background-image: url(https://mdn.mozillademos.org/files/12005/starsolid.gif), - url(https://developer.cdn.mozilla.net/media/redesign/img/favicon32.png); + url(https://developer.mozilla.org/static/img/favicon32.png); background-repeat: repeat-x, repeat-y; height: 144px; diff --git a/files/fr/web/css/background-size/index.html b/files/fr/web/css/background-size/index.html index e3c5fdd761..a882c24489 100644 --- a/files/fr/web/css/background-size/index.html +++ b/files/fr/web/css/background-size/index.html @@ -131,8 +131,7 @@ background-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/background/index.html b/files/fr/web/css/background/index.html index ea37897c46..3f17129c11 100644 --- a/files/fr/web/css/background/index.html +++ b/files/fr/web/css/background/index.html @@ -77,7 +77,7 @@ background: no-repeat center/80% url("../img/image.png"); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/block-size/index.html b/files/fr/web/css/block-size/index.html index e77282ba64..41cf91da42 100644 --- a/files/fr/web/css/block-size/index.html +++ b/files/fr/web/css/block-size/index.html @@ -53,7 +53,7 @@ block-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-color/index.html b/files/fr/web/css/border-block-color/index.html index 89093bbd82..76ecf634b4 100644 --- a/files/fr/web/css/border-block-color/index.html +++ b/files/fr/web/css/border-block-color/index.html @@ -30,7 +30,7 @@ border-block-color: #F5F6F7; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-end-color/index.html b/files/fr/web/css/border-block-end-color/index.html index 1d2a352129..2fab41ced0 100644 --- a/files/fr/web/css/border-block-end-color/index.html +++ b/files/fr/web/css/border-block-end-color/index.html @@ -45,7 +45,7 @@ border-block-end-color: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-end-style/index.html b/files/fr/web/css/border-block-end-style/index.html index efe5c0b546..7d65fc7f62 100644 --- a/files/fr/web/css/border-block-end-style/index.html +++ b/files/fr/web/css/border-block-end-style/index.html @@ -39,7 +39,7 @@ border-block-end-style: groove;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-end-width/index.html b/files/fr/web/css/border-block-end-width/index.html index ea7b2adf47..03af5873aa 100644 --- a/files/fr/web/css/border-block-end-width/index.html +++ b/files/fr/web/css/border-block-end-width/index.html @@ -35,7 +35,7 @@ border-block-end-width: thick; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-end/index.html b/files/fr/web/css/border-block-end/index.html index 45a72f3d55..0ef465b8fd 100644 --- a/files/fr/web/css/border-block-end/index.html +++ b/files/fr/web/css/border-block-end/index.html @@ -48,7 +48,7 @@ border-block-end: medium dashed green; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-start-color/index.html b/files/fr/web/css/border-block-start-color/index.html index 95ac2e171c..4093a25660 100644 --- a/files/fr/web/css/border-block-start-color/index.html +++ b/files/fr/web/css/border-block-start-color/index.html @@ -45,7 +45,7 @@ border-block-start-color: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-start-style/index.html b/files/fr/web/css/border-block-start-style/index.html index 5b00ba2aaf..e35b8a9c18 100644 --- a/files/fr/web/css/border-block-start-style/index.html +++ b/files/fr/web/css/border-block-start-style/index.html @@ -40,7 +40,7 @@ border-block-start-style: groove;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-start-width/index.html b/files/fr/web/css/border-block-start-width/index.html index 81552b8563..e79e0a3760 100644 --- a/files/fr/web/css/border-block-start-width/index.html +++ b/files/fr/web/css/border-block-start-width/index.html @@ -36,7 +36,7 @@ border-block-start-width: thick; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-start/index.html b/files/fr/web/css/border-block-start/index.html index f4bc895c1e..a57e3b2279 100644 --- a/files/fr/web/css/border-block-start/index.html +++ b/files/fr/web/css/border-block-start/index.html @@ -48,7 +48,7 @@ border-block-start: medium dashed green; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-style/index.html b/files/fr/web/css/border-block-style/index.html index 192bb68db3..c26abe770d 100644 --- a/files/fr/web/css/border-block-style/index.html +++ b/files/fr/web/css/border-block-style/index.html @@ -32,7 +32,7 @@ border-block-style: groove; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block-width/index.html b/files/fr/web/css/border-block-width/index.html index f3e3097db3..5e738b2a13 100644 --- a/files/fr/web/css/border-block-width/index.html +++ b/files/fr/web/css/border-block-width/index.html @@ -34,7 +34,7 @@ border-block-width: thick; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-block/index.html b/files/fr/web/css/border-block/index.html index 10586d701e..ed094bde76 100644 --- a/files/fr/web/css/border-block/index.html +++ b/files/fr/web/css/border-block/index.html @@ -39,7 +39,7 @@ border-block: medium dashed blue; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-bottom-color/index.html b/files/fr/web/css/border-bottom-color/index.html index bcb534cd89..7535b12883 100644 --- a/files/fr/web/css/border-bottom-color/index.html +++ b/files/fr/web/css/border-bottom-color/index.html @@ -42,7 +42,7 @@ border-bottom-color: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-bottom-left-radius/index.html b/files/fr/web/css/border-bottom-left-radius/index.html index 0f304a14ab..118ddb126a 100644 --- a/files/fr/web/css/border-bottom-left-radius/index.html +++ b/files/fr/web/css/border-bottom-left-radius/index.html @@ -58,7 +58,7 @@ border-bottom-left-radius: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-bottom-right-radius/index.html b/files/fr/web/css/border-bottom-right-radius/index.html index 9d596cb38f..8d5b7471d0 100644 --- a/files/fr/web/css/border-bottom-right-radius/index.html +++ b/files/fr/web/css/border-bottom-right-radius/index.html @@ -58,7 +58,7 @@ border-bottom-right-radius: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-bottom-style/index.html b/files/fr/web/css/border-bottom-style/index.html index 2ceac6d55b..fcc6c9585c 100644 --- a/files/fr/web/css/border-bottom-style/index.html +++ b/files/fr/web/css/border-bottom-style/index.html @@ -123,7 +123,7 @@ border-bottom-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-bottom-width/index.html b/files/fr/web/css/border-bottom-width/index.html index f1718f62d0..0516074ae6 100644 --- a/files/fr/web/css/border-bottom-width/index.html +++ b/files/fr/web/css/border-bottom-width/index.html @@ -69,7 +69,7 @@ border-bottom-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-bottom/index.html b/files/fr/web/css/border-bottom/index.html index 2a0c3e73cd..df82757d89 100644 --- a/files/fr/web/css/border-bottom/index.html +++ b/files/fr/web/css/border-bottom/index.html @@ -65,7 +65,7 @@ border-bottom: medium dashed green; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-collapse/index.html b/files/fr/web/css/border-collapse/index.html index 746860e8fe..452d196ea0 100644 --- a/files/fr/web/css/border-collapse/index.html +++ b/files/fr/web/css/border-collapse/index.html @@ -44,7 +44,7 @@ border-collapse: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-color/index.html b/files/fr/web/css/border-color/index.html index c1adde982e..356aa3674a 100644 --- a/files/fr/web/css/border-color/index.html +++ b/files/fr/web/css/border-color/index.html @@ -57,7 +57,7 @@ border-color: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-end-end-radius/index.html b/files/fr/web/css/border-end-end-radius/index.html index 45aa632ec6..aa00341145 100644 --- a/files/fr/web/css/border-end-end-radius/index.html +++ b/files/fr/web/css/border-end-end-radius/index.html @@ -41,7 +41,7 @@ border-end-end-radius: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-end-start-radius/index.html b/files/fr/web/css/border-end-start-radius/index.html index 5df2061bff..d61ceb5670 100644 --- a/files/fr/web/css/border-end-start-radius/index.html +++ b/files/fr/web/css/border-end-start-radius/index.html @@ -41,7 +41,7 @@ border-end-start-radius: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-image-outset/index.html b/files/fr/web/css/border-image-outset/index.html index 1f79067683..fd7b8305a0 100644 --- a/files/fr/web/css/border-image-outset/index.html +++ b/files/fr/web/css/border-image-outset/index.html @@ -58,7 +58,7 @@ border-image-outset: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-image-repeat/index.html b/files/fr/web/css/border-image-repeat/index.html index a790da5075..ca9ac1e013 100644 --- a/files/fr/web/css/border-image-repeat/index.html +++ b/files/fr/web/css/border-image-repeat/index.html @@ -47,7 +47,7 @@ border-image-repeat: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-image-slice/index.html b/files/fr/web/css/border-image-slice/index.html index 35136b7f07..2710cdea8f 100644 --- a/files/fr/web/css/border-image-slice/index.html +++ b/files/fr/web/css/border-image-slice/index.html @@ -71,7 +71,7 @@ border-image-slice: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-image-source/index.html b/files/fr/web/css/border-image-source/index.html index ad49355e23..f999568812 100644 --- a/files/fr/web/css/border-image-source/index.html +++ b/files/fr/web/css/border-image-source/index.html @@ -45,7 +45,7 @@ border-image-source: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-image-width/index.html b/files/fr/web/css/border-image-width/index.html index d46f98e4e9..1e2bf930a7 100644 --- a/files/fr/web/css/border-image-width/index.html +++ b/files/fr/web/css/border-image-width/index.html @@ -73,7 +73,7 @@ border-image-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-image/index.html b/files/fr/web/css/border-image/index.html index d941174c50..69f901d108 100644 --- a/files/fr/web/css/border-image/index.html +++ b/files/fr/web/css/border-image/index.html @@ -60,7 +60,7 @@ border-image: url("/images/border.png") 27 23 / 50px 30px / 1rem round space; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-color/index.html b/files/fr/web/css/border-inline-color/index.html index 8fb839bd4b..5eb5521ca9 100644 --- a/files/fr/web/css/border-inline-color/index.html +++ b/files/fr/web/css/border-inline-color/index.html @@ -30,7 +30,7 @@ border-inline-color: #F5F6F7; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-end-color/index.html b/files/fr/web/css/border-inline-end-color/index.html index 5492baa5d7..e6483fcc54 100644 --- a/files/fr/web/css/border-inline-end-color/index.html +++ b/files/fr/web/css/border-inline-end-color/index.html @@ -44,7 +44,7 @@ border-inline-end-color: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-end-style/index.html b/files/fr/web/css/border-inline-end-style/index.html index 5bfc8a592a..d0df1e447a 100644 --- a/files/fr/web/css/border-inline-end-style/index.html +++ b/files/fr/web/css/border-inline-end-style/index.html @@ -39,7 +39,7 @@ border-inline-end-style: groove;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-end-width/index.html b/files/fr/web/css/border-inline-end-width/index.html index 03607a3631..a3018a3323 100644 --- a/files/fr/web/css/border-inline-end-width/index.html +++ b/files/fr/web/css/border-inline-end-width/index.html @@ -35,7 +35,7 @@ border-inline-end-width: thick; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-end/index.html b/files/fr/web/css/border-inline-end/index.html index aa0fd3e579..4ea9d356ee 100644 --- a/files/fr/web/css/border-inline-end/index.html +++ b/files/fr/web/css/border-inline-end/index.html @@ -48,7 +48,7 @@ border-inline-end: medium dashed green; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-start-color/index.html b/files/fr/web/css/border-inline-start-color/index.html index aadf962104..54cd46db3d 100644 --- a/files/fr/web/css/border-inline-start-color/index.html +++ b/files/fr/web/css/border-inline-start-color/index.html @@ -41,7 +41,7 @@ border-inline-start-color: rgb(200, 0, 0); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-start-style/index.html b/files/fr/web/css/border-inline-start-style/index.html index b09e1dad61..33d3323554 100644 --- a/files/fr/web/css/border-inline-start-style/index.html +++ b/files/fr/web/css/border-inline-start-style/index.html @@ -41,7 +41,7 @@ border-inline-start-style: groove; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-start-width/index.html b/files/fr/web/css/border-inline-start-width/index.html index 89a5e39ca6..1cf5dd2a3c 100644 --- a/files/fr/web/css/border-inline-start-width/index.html +++ b/files/fr/web/css/border-inline-start-width/index.html @@ -36,7 +36,7 @@ border-inline-start-width: thick; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-start/index.html b/files/fr/web/css/border-inline-start/index.html index d829e716ec..fb80322e7d 100644 --- a/files/fr/web/css/border-inline-start/index.html +++ b/files/fr/web/css/border-inline-start/index.html @@ -49,7 +49,7 @@ border-inline-start: medium dashed green; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-style/index.html b/files/fr/web/css/border-inline-style/index.html index 1455b07238..520557fed7 100644 --- a/files/fr/web/css/border-inline-style/index.html +++ b/files/fr/web/css/border-inline-style/index.html @@ -32,7 +32,7 @@ border-inline-style: groove; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline-width/index.html b/files/fr/web/css/border-inline-width/index.html index bb3fb70daf..635298169d 100644 --- a/files/fr/web/css/border-inline-width/index.html +++ b/files/fr/web/css/border-inline-width/index.html @@ -32,7 +32,7 @@ border-inline-width: thick; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-inline/index.html b/files/fr/web/css/border-inline/index.html index 3360d5b1c4..45ff924926 100644 --- a/files/fr/web/css/border-inline/index.html +++ b/files/fr/web/css/border-inline/index.html @@ -39,7 +39,7 @@ border-inline: medium dashed blue; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-left-color/index.html b/files/fr/web/css/border-left-color/index.html index 974ccbd709..f0362883eb 100644 --- a/files/fr/web/css/border-left-color/index.html +++ b/files/fr/web/css/border-left-color/index.html @@ -42,7 +42,7 @@ border-left-color: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-left-style/index.html b/files/fr/web/css/border-left-style/index.html index f677494c11..afaf090894 100644 --- a/files/fr/web/css/border-left-style/index.html +++ b/files/fr/web/css/border-left-style/index.html @@ -123,7 +123,7 @@ border-left-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-left-width/index.html b/files/fr/web/css/border-left-width/index.html index 047c1c5968..074b057dd9 100644 --- a/files/fr/web/css/border-left-width/index.html +++ b/files/fr/web/css/border-left-width/index.html @@ -69,7 +69,7 @@ border-left-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-left/index.html b/files/fr/web/css/border-left/index.html index 8ba3a36011..ee23b6c814 100644 --- a/files/fr/web/css/border-left/index.html +++ b/files/fr/web/css/border-left/index.html @@ -65,7 +65,7 @@ border-left: medium dashed green; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-radius/index.html b/files/fr/web/css/border-radius/index.html index 0966c69e16..aaa3835af0 100644 --- a/files/fr/web/css/border-radius/index.html +++ b/files/fr/web/css/border-radius/index.html @@ -161,7 +161,7 @@ border-bottom-left-radius: 3px 4px; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-right-color/index.html b/files/fr/web/css/border-right-color/index.html index 23507f4a4e..0e0077c335 100644 --- a/files/fr/web/css/border-right-color/index.html +++ b/files/fr/web/css/border-right-color/index.html @@ -40,7 +40,7 @@ border-right-color: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-right-style/index.html b/files/fr/web/css/border-right-style/index.html index 0ae7291ec4..15c7a01f00 100644 --- a/files/fr/web/css/border-right-style/index.html +++ b/files/fr/web/css/border-right-style/index.html @@ -125,7 +125,7 @@ border-right-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-right-width/index.html b/files/fr/web/css/border-right-width/index.html index 1461fcc36c..65ab0d2765 100644 --- a/files/fr/web/css/border-right-width/index.html +++ b/files/fr/web/css/border-right-width/index.html @@ -68,7 +68,7 @@ border-right-width: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-right/index.html b/files/fr/web/css/border-right/index.html index f0e56d1448..93a30ecd9b 100644 --- a/files/fr/web/css/border-right/index.html +++ b/files/fr/web/css/border-right/index.html @@ -65,7 +65,7 @@ border-right: medium dashed green; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-spacing/index.html b/files/fr/web/css/border-spacing/index.html index b40da3aece..be463589a9 100644 --- a/files/fr/web/css/border-spacing/index.html +++ b/files/fr/web/css/border-spacing/index.html @@ -55,7 +55,7 @@ border-spacing: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-start-end-radius/index.html b/files/fr/web/css/border-start-end-radius/index.html index 958bb9fda2..5e46160fb6 100644 --- a/files/fr/web/css/border-start-end-radius/index.html +++ b/files/fr/web/css/border-start-end-radius/index.html @@ -41,7 +41,7 @@ border-start-end-radius: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-start-start-radius/index.html b/files/fr/web/css/border-start-start-radius/index.html index 89501028b0..59c1019a8b 100644 --- a/files/fr/web/css/border-start-start-radius/index.html +++ b/files/fr/web/css/border-start-start-radius/index.html @@ -41,7 +41,7 @@ border-start-start-radius: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-style/index.html b/files/fr/web/css/border-style/index.html index 2ff9885747..5836ac0909 100644 --- a/files/fr/web/css/border-style/index.html +++ b/files/fr/web/css/border-style/index.html @@ -143,7 +143,7 @@ border-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-top-color/index.html b/files/fr/web/css/border-top-color/index.html index e3a877462e..81588b7e1a 100644 --- a/files/fr/web/css/border-top-color/index.html +++ b/files/fr/web/css/border-top-color/index.html @@ -42,7 +42,7 @@ border-top-color: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-top-left-radius/index.html b/files/fr/web/css/border-top-left-radius/index.html index 8654e68903..cc00707430 100644 --- a/files/fr/web/css/border-top-left-radius/index.html +++ b/files/fr/web/css/border-top-left-radius/index.html @@ -53,7 +53,7 @@ border-top-left-radius: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-top-right-radius/index.html b/files/fr/web/css/border-top-right-radius/index.html index 1b3c846a99..639dc723f7 100644 --- a/files/fr/web/css/border-top-right-radius/index.html +++ b/files/fr/web/css/border-top-right-radius/index.html @@ -55,7 +55,7 @@ border-top-right-radius: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-top-style/index.html b/files/fr/web/css/border-top-style/index.html index d541ac4b44..472752bc78 100644 --- a/files/fr/web/css/border-top-style/index.html +++ b/files/fr/web/css/border-top-style/index.html @@ -125,7 +125,7 @@ border-top-style: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-top-width/index.html b/files/fr/web/css/border-top-width/index.html index 1f61f14ebc..5dd053fd8d 100644 --- a/files/fr/web/css/border-top-width/index.html +++ b/files/fr/web/css/border-top-width/index.html @@ -69,7 +69,7 @@ border-top-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-top/index.html b/files/fr/web/css/border-top/index.html index 9581bf1ec2..2786065345 100644 --- a/files/fr/web/css/border-top/index.html +++ b/files/fr/web/css/border-top/index.html @@ -65,7 +65,7 @@ border-top: medium dashed green; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border-width/index.html b/files/fr/web/css/border-width/index.html index a4ced190b5..dc73a46c0e 100644 --- a/files/fr/web/css/border-width/index.html +++ b/files/fr/web/css/border-width/index.html @@ -98,7 +98,7 @@ border-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/border/index.html b/files/fr/web/css/border/index.html index 19e1675de2..eb9edd47bf 100644 --- a/files/fr/web/css/border/index.html +++ b/files/fr/web/css/border/index.html @@ -69,7 +69,7 @@ border: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/bottom/index.html b/files/fr/web/css/bottom/index.html index e50831a502..49f4b1f8ed 100644 --- a/files/fr/web/css/bottom/index.html +++ b/files/fr/web/css/bottom/index.html @@ -69,7 +69,7 @@ bottom: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/box-align/index.html b/files/fr/web/css/box-align/index.html index 1f9c66610d..936b8d02a5 100644 --- a/files/fr/web/css/box-align/index.html +++ b/files/fr/web/css/box-align/index.html @@ -48,7 +48,7 @@ box-lines: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/box-decoration-break/index.html b/files/fr/web/css/box-decoration-break/index.html index 94b952c8db..5a46e778d2 100644 --- a/files/fr/web/css/box-decoration-break/index.html +++ b/files/fr/web/css/box-decoration-break/index.html @@ -41,7 +41,7 @@ box-decoration-break: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/box-direction/index.html b/files/fr/web/css/box-direction/index.html index dfb902df46..3ed9db2f03 100644 --- a/files/fr/web/css/box-direction/index.html +++ b/files/fr/web/css/box-direction/index.html @@ -39,8 +39,7 @@ box-direction: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/box-flex-group/index.html b/files/fr/web/css/box-flex-group/index.html index d875361fa4..642515de80 100644 --- a/files/fr/web/css/box-flex-group/index.html +++ b/files/fr/web/css/box-flex-group/index.html @@ -39,7 +39,7 @@ box-flex-group: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/box-flex/index.html b/files/fr/web/css/box-flex/index.html index 9a84412069..0983634657 100644 --- a/files/fr/web/css/box-flex/index.html +++ b/files/fr/web/css/box-flex/index.html @@ -43,7 +43,7 @@ translation_of: Web/CSS/box-flex <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/box-lines/index.html b/files/fr/web/css/box-lines/index.html index cae417f7d6..3e422067c1 100644 --- a/files/fr/web/css/box-lines/index.html +++ b/files/fr/web/css/box-lines/index.html @@ -53,7 +53,7 @@ box-lines: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/box-ordinal-group/index.html b/files/fr/web/css/box-ordinal-group/index.html index 76bee83c53..a26672f7e6 100644 --- a/files/fr/web/css/box-ordinal-group/index.html +++ b/files/fr/web/css/box-ordinal-group/index.html @@ -37,7 +37,7 @@ box-ordinal-group: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/box-orient/index.html b/files/fr/web/css/box-orient/index.html index a00996d4bd..2f36442b78 100644 --- a/files/fr/web/css/box-orient/index.html +++ b/files/fr/web/css/box-orient/index.html @@ -53,7 +53,7 @@ box-orient: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/box-pack/index.html b/files/fr/web/css/box-pack/index.html index bd634e8f81..d6f70ddfbc 100644 --- a/files/fr/web/css/box-pack/index.html +++ b/files/fr/web/css/box-pack/index.html @@ -51,7 +51,7 @@ box-pack: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/box-shadow/index.html b/files/fr/web/css/box-shadow/index.html index b92597dddb..c1f8687fdf 100644 --- a/files/fr/web/css/box-shadow/index.html +++ b/files/fr/web/css/box-shadow/index.html @@ -79,7 +79,7 @@ box-shadow: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 class="cleared" id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/box-sizing/index.html b/files/fr/web/css/box-sizing/index.html index 5e39cf30d5..de65d4a99c 100644 --- a/files/fr/web/css/box-sizing/index.html +++ b/files/fr/web/css/box-sizing/index.html @@ -64,7 +64,7 @@ box-sizing: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <div class="blockIndicator note"> <p>Note : La valeur <code>padding-box</code> a été dépréciée.</p> diff --git a/files/fr/web/css/break-after/index.html b/files/fr/web/css/break-after/index.html index 8db0380d03..583c52abb9 100644 --- a/files/fr/web/css/break-after/index.html +++ b/files/fr/web/css/break-after/index.html @@ -88,7 +88,7 @@ break-after: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Synonymes_pour_page-break-after">Synonymes pour <code>page-break-after</code></h2> diff --git a/files/fr/web/css/break-before/index.html b/files/fr/web/css/break-before/index.html index 35e2f5dbf8..83e6f66665 100644 --- a/files/fr/web/css/break-before/index.html +++ b/files/fr/web/css/break-before/index.html @@ -106,7 +106,7 @@ break-before: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Aliassynonymes_pour_les_ruptures_de_page">Alias/synonymes pour les ruptures de page</h2> diff --git a/files/fr/web/css/break-inside/index.html b/files/fr/web/css/break-inside/index.html index 89fd65ae74..f95c2a62ec 100644 --- a/files/fr/web/css/break-inside/index.html +++ b/files/fr/web/css/break-inside/index.html @@ -56,7 +56,7 @@ break-inside: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Synonymes_pour_page-break-inside">Synonymes pour <code>page-break-inside</code></h2> diff --git a/files/fr/web/css/calc()/index.html b/files/fr/web/css/calc()/index.html index da2f5a704a..0349606fcb 100644 --- a/files/fr/web/css/calc()/index.html +++ b/files/fr/web/css/calc()/index.html @@ -47,7 +47,7 @@ width: calc(100% - 80px); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/caption-side/index.html b/files/fr/web/css/caption-side/index.html index 8dc73a5ca1..3f7f3ad70b 100644 --- a/files/fr/web/css/caption-side/index.html +++ b/files/fr/web/css/caption-side/index.html @@ -58,7 +58,7 @@ caption-side: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/caret-color/index.html b/files/fr/web/css/caret-color/index.html index e7d3578762..bad8fc057e 100644 --- a/files/fr/web/css/caret-color/index.html +++ b/files/fr/web/css/caret-color/index.html @@ -47,7 +47,7 @@ caret-color: hsla(228, 4%, 24%, 0.8);</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/clamp()/index.html b/files/fr/web/css/clamp()/index.html index 8b30108198..469a0b67db 100644 --- a/files/fr/web/css/clamp()/index.html +++ b/files/fr/web/css/clamp()/index.html @@ -55,7 +55,7 @@ width: 64px; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/clear/index.html b/files/fr/web/css/clear/index.html index a91dbec9b0..d2fb8f160c 100644 --- a/files/fr/web/css/clear/index.html +++ b/files/fr/web/css/clear/index.html @@ -67,7 +67,7 @@ clear: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/clip-path/index.html b/files/fr/web/css/clip-path/index.html index 0fc8221df3..ebdaa26dd4 100644 --- a/files/fr/web/css/clip-path/index.html +++ b/files/fr/web/css/clip-path/index.html @@ -92,7 +92,7 @@ clip-path: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/clip/index.html b/files/fr/web/css/clip/index.html index b5aed6422a..c092783f65 100644 --- a/files/fr/web/css/clip/index.html +++ b/files/fr/web/css/clip/index.html @@ -46,8 +46,7 @@ clip: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/color-adjust/index.html b/files/fr/web/css/color-adjust/index.html index b4ba77f6fd..9a056a5094 100644 --- a/files/fr/web/css/color-adjust/index.html +++ b/files/fr/web/css/color-adjust/index.html @@ -37,7 +37,7 @@ color-adjust: exact;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Notes_d'utilisation">Notes d'utilisation</h2> diff --git a/files/fr/web/css/color/index.html b/files/fr/web/css/color/index.html index 805eeb54fb..6b4df4d801 100644 --- a/files/fr/web/css/color/index.html +++ b/files/fr/web/css/color/index.html @@ -68,7 +68,7 @@ color: unset; <h3 id="Formal_syntax">Formal syntax</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/column-count/index.html b/files/fr/web/css/column-count/index.html index 97e3a14f65..eead5a793c 100644 --- a/files/fr/web/css/column-count/index.html +++ b/files/fr/web/css/column-count/index.html @@ -41,7 +41,7 @@ column-count: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/column-fill/index.html b/files/fr/web/css/column-fill/index.html index a2a64b6849..e6183e4854 100644 --- a/files/fr/web/css/column-fill/index.html +++ b/files/fr/web/css/column-fill/index.html @@ -43,7 +43,7 @@ column-fill: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/column-gap/index.html b/files/fr/web/css/column-gap/index.html index 99ac3c185c..04c98ca648 100644 --- a/files/fr/web/css/column-gap/index.html +++ b/files/fr/web/css/column-gap/index.html @@ -56,7 +56,7 @@ column-gap: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/column-rule-color/index.html b/files/fr/web/css/column-rule-color/index.html index e49ae2b9e4..018be8b7a9 100644 --- a/files/fr/web/css/column-rule-color/index.html +++ b/files/fr/web/css/column-rule-color/index.html @@ -39,8 +39,7 @@ column-rule-color: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/column-rule-style/index.html b/files/fr/web/css/column-rule-style/index.html index 64a2b08caa..399e619f59 100644 --- a/files/fr/web/css/column-rule-style/index.html +++ b/files/fr/web/css/column-rule-style/index.html @@ -46,8 +46,7 @@ column-rule-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/column-rule-width/index.html b/files/fr/web/css/column-rule-width/index.html index 3797b147cb..a270696ca0 100644 --- a/files/fr/web/css/column-rule-width/index.html +++ b/files/fr/web/css/column-rule-width/index.html @@ -44,8 +44,7 @@ column-rule-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/column-rule/index.html b/files/fr/web/css/column-rule/index.html index b5df7f6e0e..7ca00d86b3 100644 --- a/files/fr/web/css/column-rule/index.html +++ b/files/fr/web/css/column-rule/index.html @@ -50,8 +50,7 @@ column-rule: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/column-span/index.html b/files/fr/web/css/column-span/index.html index 384a645097..3feee1df05 100644 --- a/files/fr/web/css/column-span/index.html +++ b/files/fr/web/css/column-span/index.html @@ -38,7 +38,7 @@ column-span: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/column-width/index.html b/files/fr/web/css/column-width/index.html index 748eadc8ec..852dbeb4ae 100644 --- a/files/fr/web/css/column-width/index.html +++ b/files/fr/web/css/column-width/index.html @@ -45,7 +45,7 @@ column-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/columns/index.html b/files/fr/web/css/columns/index.html index ce9e7257c9..6c1c251a65 100644 --- a/files/fr/web/css/columns/index.html +++ b/files/fr/web/css/columns/index.html @@ -52,7 +52,7 @@ columns: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/contain/index.html b/files/fr/web/css/contain/index.html index c6c9747b19..22c492d855 100644 --- a/files/fr/web/css/contain/index.html +++ b/files/fr/web/css/contain/index.html @@ -62,7 +62,7 @@ contain: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/content/index.html b/files/fr/web/css/content/index.html index 6734f52912..25e5adc6d1 100644 --- a/files/fr/web/css/content/index.html +++ b/files/fr/web/css/content/index.html @@ -75,8 +75,7 @@ content: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/counter()/index.html b/files/fr/web/css/counter()/index.html index a53c715337..2558f46df8 100644 --- a/files/fr/web/css/counter()/index.html +++ b/files/fr/web/css/counter()/index.html @@ -41,7 +41,7 @@ counter(nomcompteur, upper-roman)</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/counter-increment/index.html b/files/fr/web/css/counter-increment/index.html index 7eaa65b7d3..e8ffae635d 100644 --- a/files/fr/web/css/counter-increment/index.html +++ b/files/fr/web/css/counter-increment/index.html @@ -60,7 +60,7 @@ counter-increment: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/counter-reset/index.html b/files/fr/web/css/counter-reset/index.html index ec093ec4ac..0574d7b906 100644 --- a/files/fr/web/css/counter-reset/index.html +++ b/files/fr/web/css/counter-reset/index.html @@ -61,8 +61,7 @@ counter-reset: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/counter-set/index.html b/files/fr/web/css/counter-set/index.html index 30836ddc75..23f2e95e74 100644 --- a/files/fr/web/css/counter-set/index.html +++ b/files/fr/web/css/counter-set/index.html @@ -56,8 +56,7 @@ counter-set: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/counters()/index.html b/files/fr/web/css/counters()/index.html index 9c58ab42a0..61ba0d209b 100644 --- a/files/fr/web/css/counters()/index.html +++ b/files/fr/web/css/counters()/index.html @@ -49,7 +49,7 @@ counters(countername, '.', upper-roman)</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/cross-fade()/index.html b/files/fr/web/css/cross-fade()/index.html index 0c995b6816..103a82a8ea 100644 --- a/files/fr/web/css/cross-fade()/index.html +++ b/files/fr/web/css/cross-fade()/index.html @@ -52,7 +52,7 @@ cross-fade(url(green.png) 75%, url(red.png) 75%); /* image avec du rouge et ver <div class="hidden">La syntaxe formelle décrite sur cette page est générée à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à proposer une<em>pull request</em> sur <a href="https://github.com/mdn/data">https://github.com/mdn/data</a>.</div> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <ul> </ul> diff --git a/files/fr/web/css/cursor/index.html b/files/fr/web/css/cursor/index.html index 0d83725ddc..90d59cb8b4 100644 --- a/files/fr/web/css/cursor/index.html +++ b/files/fr/web/css/cursor/index.html @@ -253,8 +253,7 @@ cursor: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Notes_d'utilisation">Notes d'utilisation</h2> diff --git a/files/fr/web/css/direction/index.html b/files/fr/web/css/direction/index.html index dd91c43510..78bfa89ee0 100644 --- a/files/fr/web/css/direction/index.html +++ b/files/fr/web/css/direction/index.html @@ -45,7 +45,7 @@ direction: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/display-box/index.html b/files/fr/web/css/display-box/index.html index 532fa82e11..99b2ff4409 100644 --- a/files/fr/web/css/display-box/index.html +++ b/files/fr/web/css/display-box/index.html @@ -25,7 +25,7 @@ translation_of: Web/CSS/display-box <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/display-inside/index.html b/files/fr/web/css/display-inside/index.html index 2091265318..4fafeacc39 100644 --- a/files/fr/web/css/display-inside/index.html +++ b/files/fr/web/css/display-inside/index.html @@ -40,7 +40,7 @@ translation_of: Web/CSS/display-inside <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/display-legacy/index.html b/files/fr/web/css/display-legacy/index.html index 1bd84ba254..c8189c474d 100644 --- a/files/fr/web/css/display-legacy/index.html +++ b/files/fr/web/css/display-legacy/index.html @@ -34,7 +34,7 @@ translation_of: Web/CSS/display-legacy <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/display-listitem/index.html b/files/fr/web/css/display-listitem/index.html index d5fcffc88f..ea70fd3cac 100644 --- a/files/fr/web/css/display-listitem/index.html +++ b/files/fr/web/css/display-listitem/index.html @@ -21,7 +21,7 @@ translation_of: Web/CSS/display-listitem <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/display-outside/index.html b/files/fr/web/css/display-outside/index.html index b646dfdd70..099577ec2a 100644 --- a/files/fr/web/css/display-outside/index.html +++ b/files/fr/web/css/display-outside/index.html @@ -36,8 +36,7 @@ translation_of: Web/CSS/display-outside <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}} -</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/display/index.html b/files/fr/web/css/display/index.html index bf24d05e9a..96041f0e36 100644 --- a/files/fr/web/css/display/index.html +++ b/files/fr/web/css/display/index.html @@ -113,7 +113,7 @@ display: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/empty-cells/index.html b/files/fr/web/css/empty-cells/index.html index 96841dab17..89e95ac417 100644 --- a/files/fr/web/css/empty-cells/index.html +++ b/files/fr/web/css/empty-cells/index.html @@ -42,8 +42,7 @@ empty-cells: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/env()/index.html b/files/fr/web/css/env()/index.html index aaf9a7792d..608edbe2a5 100644 --- a/files/fr/web/css/env()/index.html +++ b/files/fr/web/css/env()/index.html @@ -58,7 +58,7 @@ env(safe-area-inset-left, 1.4rem); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Examples">Examples</h2> diff --git a/files/fr/web/css/filter/index.html b/files/fr/web/css/filter/index.html index 9f24d80f55..77af3153c0 100644 --- a/files/fr/web/css/filter/index.html +++ b/files/fr/web/css/filter/index.html @@ -62,7 +62,7 @@ filter: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/fit-content/index.html b/files/fr/web/css/fit-content/index.html index 25eeb21a10..13f9464811 100644 --- a/files/fr/web/css/fit-content/index.html +++ b/files/fr/web/css/fit-content/index.html @@ -41,7 +41,7 @@ fit-content(40%) <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/flex-basis/index.html b/files/fr/web/css/flex-basis/index.html index 9e12dbdf85..cdd3aee666 100644 --- a/files/fr/web/css/flex-basis/index.html +++ b/files/fr/web/css/flex-basis/index.html @@ -68,7 +68,7 @@ flex-basis: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/flex-direction/index.html b/files/fr/web/css/flex-direction/index.html index 7c21fc1d64..e89a29d78e 100644 --- a/files/fr/web/css/flex-direction/index.html +++ b/files/fr/web/css/flex-direction/index.html @@ -57,7 +57,7 @@ flex-direction: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/flex-flow/index.html b/files/fr/web/css/flex-flow/index.html index f83f7d8f3c..7fc9632d88 100644 --- a/files/fr/web/css/flex-flow/index.html +++ b/files/fr/web/css/flex-flow/index.html @@ -47,7 +47,7 @@ flex-flow: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/flex-grow/index.html b/files/fr/web/css/flex-grow/index.html index 852dc66dfa..135f09fd0f 100644 --- a/files/fr/web/css/flex-grow/index.html +++ b/files/fr/web/css/flex-grow/index.html @@ -45,7 +45,7 @@ flex-shrink: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/flex-shrink/index.html b/files/fr/web/css/flex-shrink/index.html index 7d726652f0..e1b1e517c4 100644 --- a/files/fr/web/css/flex-shrink/index.html +++ b/files/fr/web/css/flex-shrink/index.html @@ -43,7 +43,7 @@ flex-shrink: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/flex-wrap/index.html b/files/fr/web/css/flex-wrap/index.html index 306131015b..8228be6282 100644 --- a/files/fr/web/css/flex-wrap/index.html +++ b/files/fr/web/css/flex-wrap/index.html @@ -46,7 +46,7 @@ flex-wrap: unset; </dt> </dl> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/flex/index.html b/files/fr/web/css/flex/index.html index c88b0da7b0..f6d613988e 100644 --- a/files/fr/web/css/flex/index.html +++ b/files/fr/web/css/flex/index.html @@ -208,7 +208,7 @@ flex: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/float/index.html b/files/fr/web/css/float/index.html index b52d245e44..8aa9be9db1 100644 --- a/files/fr/web/css/float/index.html +++ b/files/fr/web/css/float/index.html @@ -119,7 +119,7 @@ float: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-family/index.html b/files/fr/web/css/font-family/index.html index 4b5d523a2f..3ad898374c 100644 --- a/files/fr/web/css/font-family/index.html +++ b/files/fr/web/css/font-family/index.html @@ -112,7 +112,7 @@ font-family: Hawaii 5-0, sans-serif;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-feature-settings/index.html b/files/fr/web/css/font-feature-settings/index.html index d9f28d7379..4164827e03 100644 --- a/files/fr/web/css/font-feature-settings/index.html +++ b/files/fr/web/css/font-feature-settings/index.html @@ -48,7 +48,7 @@ font-feature-settings: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-kerning/index.html b/files/fr/web/css/font-kerning/index.html index 8f3de1baa0..f6236e8973 100644 --- a/files/fr/web/css/font-kerning/index.html +++ b/files/fr/web/css/font-kerning/index.html @@ -36,7 +36,7 @@ font-kerning: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-language-override/index.html b/files/fr/web/css/font-language-override/index.html index 510a83a222..8d21fd7b61 100644 --- a/files/fr/web/css/font-language-override/index.html +++ b/files/fr/web/css/font-language-override/index.html @@ -42,7 +42,7 @@ font-language-override: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-optical-sizing/index.html b/files/fr/web/css/font-optical-sizing/index.html index 9619a3bdf1..95c8f4d848 100644 --- a/files/fr/web/css/font-optical-sizing/index.html +++ b/files/fr/web/css/font-optical-sizing/index.html @@ -40,7 +40,7 @@ font-optical-sizing: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-size-adjust/index.html b/files/fr/web/css/font-size-adjust/index.html index 387d535277..672c094843 100644 --- a/files/fr/web/css/font-size-adjust/index.html +++ b/files/fr/web/css/font-size-adjust/index.html @@ -57,7 +57,7 @@ font-size-adjust: 0.5; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-size/index.html b/files/fr/web/css/font-size/index.html index 8b9a61693f..8ea552ffae 100644 --- a/files/fr/web/css/font-size/index.html +++ b/files/fr/web/css/font-size/index.html @@ -71,7 +71,7 @@ font-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Les_différentes_approches">Les différentes approches</h2> diff --git a/files/fr/web/css/font-stretch/index.html b/files/fr/web/css/font-stretch/index.html index 10ade6d4e5..191f44a90e 100644 --- a/files/fr/web/css/font-stretch/index.html +++ b/files/fr/web/css/font-stretch/index.html @@ -169,7 +169,7 @@ font-stretch: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-style/index.html b/files/fr/web/css/font-style/index.html index d1807d4ff1..04d54b13f3 100644 --- a/files/fr/web/css/font-style/index.html +++ b/files/fr/web/css/font-style/index.html @@ -50,7 +50,7 @@ font-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h3 id="Variable_fonts">Variable fonts</h3> diff --git a/files/fr/web/css/font-synthesis/index.html b/files/fr/web/css/font-synthesis/index.html index 3eba97d377..3045233f94 100644 --- a/files/fr/web/css/font-synthesis/index.html +++ b/files/fr/web/css/font-synthesis/index.html @@ -50,7 +50,7 @@ font-synthesis: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-variant-alternates/index.html b/files/fr/web/css/font-variant-alternates/index.html index ba6cd8ac54..2e0b6e3651 100644 --- a/files/fr/web/css/font-variant-alternates/index.html +++ b/files/fr/web/css/font-variant-alternates/index.html @@ -66,7 +66,7 @@ font-variant-alternates: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-variant-caps/index.html b/files/fr/web/css/font-variant-caps/index.html index 7c198010cb..9325e8ce87 100644 --- a/files/fr/web/css/font-variant-caps/index.html +++ b/files/fr/web/css/font-variant-caps/index.html @@ -70,7 +70,7 @@ font-variant-caps: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-variant-east-asian/index.html b/files/fr/web/css/font-variant-east-asian/index.html index 22d44dfb1a..edde372a79 100644 --- a/files/fr/web/css/font-variant-east-asian/index.html +++ b/files/fr/web/css/font-variant-east-asian/index.html @@ -91,7 +91,7 @@ font-variant-east-asian: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-variant-ligatures/index.html b/files/fr/web/css/font-variant-ligatures/index.html index 1d5a545e78..052c635a7f 100644 --- a/files/fr/web/css/font-variant-ligatures/index.html +++ b/files/fr/web/css/font-variant-ligatures/index.html @@ -76,7 +76,7 @@ font-variant-ligatures: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-variant-numeric/index.html b/files/fr/web/css/font-variant-numeric/index.html index 382a387f47..69734f869d 100644 --- a/files/fr/web/css/font-variant-numeric/index.html +++ b/files/fr/web/css/font-variant-numeric/index.html @@ -75,7 +75,7 @@ font-variant-numeric: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-variant-position/index.html b/files/fr/web/css/font-variant-position/index.html index b506bedb2b..30cfbabc83 100644 --- a/files/fr/web/css/font-variant-position/index.html +++ b/files/fr/web/css/font-variant-position/index.html @@ -45,7 +45,7 @@ font-variant-position: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-variant/index.html b/files/fr/web/css/font-variant/index.html index d6fc3654e0..ef42dc7dee 100644 --- a/files/fr/web/css/font-variant/index.html +++ b/files/fr/web/css/font-variant/index.html @@ -47,7 +47,7 @@ font-variant: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font-variation-settings/index.html b/files/fr/web/css/font-variation-settings/index.html index fc5df8a335..b950691477 100644 --- a/files/fr/web/css/font-variation-settings/index.html +++ b/files/fr/web/css/font-variation-settings/index.html @@ -54,7 +54,7 @@ font-variation-settings: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Axes_enregistrés_et_axes_spécifiques">Axes enregistrés et axes spécifiques</h2> diff --git a/files/fr/web/css/font-weight/index.html b/files/fr/web/css/font-weight/index.html index cfe8c8e614..c2daa8111a 100644 --- a/files/fr/web/css/font-weight/index.html +++ b/files/fr/web/css/font-weight/index.html @@ -295,7 +295,7 @@ update(); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/font/index.html b/files/fr/web/css/font/index.html index 7dcfa34eae..2a14e5a34c 100644 --- a/files/fr/web/css/font/index.html +++ b/files/fr/web/css/font/index.html @@ -129,7 +129,7 @@ font: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/gap/index.html b/files/fr/web/css/gap/index.html index 8ce73e5e32..31466d70b4 100644 --- a/files/fr/web/css/gap/index.html +++ b/files/fr/web/css/gap/index.html @@ -70,7 +70,7 @@ gap: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-area/index.html b/files/fr/web/css/grid-area/index.html index 11f8d6af87..7e39c67eac 100644 --- a/files/fr/web/css/grid-area/index.html +++ b/files/fr/web/css/grid-area/index.html @@ -78,7 +78,7 @@ grid-area: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-auto-columns/index.html b/files/fr/web/css/grid-auto-columns/index.html index 07cac850ff..20594cede4 100644 --- a/files/fr/web/css/grid-auto-columns/index.html +++ b/files/fr/web/css/grid-auto-columns/index.html @@ -92,7 +92,7 @@ grid-auto-columns: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-auto-flow/index.html b/files/fr/web/css/grid-auto-flow/index.html index 375fb92ba8..e153d50cac 100644 --- a/files/fr/web/css/grid-auto-flow/index.html +++ b/files/fr/web/css/grid-auto-flow/index.html @@ -52,7 +52,7 @@ grid-auto-flow: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-auto-rows/index.html b/files/fr/web/css/grid-auto-rows/index.html index cd4d6c6b97..553b8230f0 100644 --- a/files/fr/web/css/grid-auto-rows/index.html +++ b/files/fr/web/css/grid-auto-rows/index.html @@ -85,7 +85,7 @@ grid-auto-rows: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-column-end/index.html b/files/fr/web/css/grid-column-end/index.html index f47f8896cc..2ae1cdfec6 100644 --- a/files/fr/web/css/grid-column-end/index.html +++ b/files/fr/web/css/grid-column-end/index.html @@ -65,7 +65,7 @@ grid-column-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-column-start/index.html b/files/fr/web/css/grid-column-start/index.html index b49f66fc80..e77c063c34 100644 --- a/files/fr/web/css/grid-column-start/index.html +++ b/files/fr/web/css/grid-column-start/index.html @@ -77,7 +77,7 @@ grid-column-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-column/index.html b/files/fr/web/css/grid-column/index.html index 3ad7be06b1..395d185a96 100644 --- a/files/fr/web/css/grid-column/index.html +++ b/files/fr/web/css/grid-column/index.html @@ -84,7 +84,7 @@ grid-column: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-row-end/index.html b/files/fr/web/css/grid-row-end/index.html index 93a883beb2..7f123dc9ba 100644 --- a/files/fr/web/css/grid-row-end/index.html +++ b/files/fr/web/css/grid-row-end/index.html @@ -65,7 +65,7 @@ grid-row-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-row-start/index.html b/files/fr/web/css/grid-row-start/index.html index 8f396d02ec..9bf96a8365 100644 --- a/files/fr/web/css/grid-row-start/index.html +++ b/files/fr/web/css/grid-row-start/index.html @@ -77,7 +77,7 @@ grid-row-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-row/index.html b/files/fr/web/css/grid-row/index.html index 3970f9ea5f..5983125170 100644 --- a/files/fr/web/css/grid-row/index.html +++ b/files/fr/web/css/grid-row/index.html @@ -72,7 +72,7 @@ grid-row: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-template-areas/index.html b/files/fr/web/css/grid-template-areas/index.html index 4bb71a1f5a..bc3f17fa2a 100644 --- a/files/fr/web/css/grid-template-areas/index.html +++ b/files/fr/web/css/grid-template-areas/index.html @@ -45,7 +45,7 @@ grid-template-areas: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/grid-template-columns/index.html b/files/fr/web/css/grid-template-columns/index.html index f6d58df3f0..e1d5d93581 100644 --- a/files/fr/web/css/grid-template-columns/index.html +++ b/files/fr/web/css/grid-template-columns/index.html @@ -76,7 +76,7 @@ grid-template-columns: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-template-rows/index.html b/files/fr/web/css/grid-template-rows/index.html index 0e31daf6f7..da7e0ca16f 100644 --- a/files/fr/web/css/grid-template-rows/index.html +++ b/files/fr/web/css/grid-template-rows/index.html @@ -80,7 +80,7 @@ grid-template-rows: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid-template/index.html b/files/fr/web/css/grid-template/index.html index 1311f23f82..6df40ad48a 100644 --- a/files/fr/web/css/grid-template/index.html +++ b/files/fr/web/css/grid-template/index.html @@ -60,7 +60,7 @@ grid-template: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/grid/index.html b/files/fr/web/css/grid/index.html index ead926238c..e7a641fffa 100644 --- a/files/fr/web/css/grid/index.html +++ b/files/fr/web/css/grid/index.html @@ -64,7 +64,7 @@ grid: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/hanging-punctuation/index.html b/files/fr/web/css/hanging-punctuation/index.html index 7380231a60..5f3ab73ca6 100644 --- a/files/fr/web/css/hanging-punctuation/index.html +++ b/files/fr/web/css/hanging-punctuation/index.html @@ -73,7 +73,7 @@ hanging-punctuation: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/height/index.html b/files/fr/web/css/height/index.html index e8fe76af40..cc23cf53af 100644 --- a/files/fr/web/css/height/index.html +++ b/files/fr/web/css/height/index.html @@ -69,7 +69,7 @@ height: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/hyphens/index.html b/files/fr/web/css/hyphens/index.html index 388fcaf226..3fcb8c0785 100644 --- a/files/fr/web/css/hyphens/index.html +++ b/files/fr/web/css/hyphens/index.html @@ -47,7 +47,7 @@ hyphens: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Suggérer_des_emplacements_de_coupe_pour_les_lignes">Suggérer des emplacements de coupe pour les lignes</h2> diff --git a/files/fr/web/css/image()/index.html b/files/fr/web/css/image()/index.html index 0be7c11f52..5e9e07d389 100644 --- a/files/fr/web/css/image()/index.html +++ b/files/fr/web/css/image()/index.html @@ -17,8 +17,7 @@ translation_of: Web/CSS/image() <h2 id="Syntax" name="Syntax">Syntaxe</h2> -<pre class="syntaxbox notranslate">{{CSSSyntax("image()")}} -</pre> +{{CSSSyntax("image()")}} <h3 id="Paramètres">Paramètres</h3> diff --git a/files/fr/web/css/image-orientation/index.html b/files/fr/web/css/image-orientation/index.html index a12c6348b3..9e7225ab58 100644 --- a/files/fr/web/css/image-orientation/index.html +++ b/files/fr/web/css/image-orientation/index.html @@ -54,7 +54,7 @@ image-orientation: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Notes_d'utilisation">Notes d'utilisation</h2> diff --git a/files/fr/web/css/image-rendering/index.html b/files/fr/web/css/image-rendering/index.html index 7b28a4c0b4..64f5fd7871 100644 --- a/files/fr/web/css/image-rendering/index.html +++ b/files/fr/web/css/image-rendering/index.html @@ -45,7 +45,7 @@ image-rendering: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/ime-mode/index.html b/files/fr/web/css/ime-mode/index.html index 0bae84381a..27caa32436 100644 --- a/files/fr/web/css/ime-mode/index.html +++ b/files/fr/web/css/ime-mode/index.html @@ -58,7 +58,7 @@ ime-mode: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/initial-letter-align/index.html b/files/fr/web/css/initial-letter-align/index.html index cdbe179beb..548b2e359a 100644 --- a/files/fr/web/css/initial-letter-align/index.html +++ b/files/fr/web/css/initial-letter-align/index.html @@ -50,7 +50,7 @@ initial-letter-align: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/initial-letter/index.html b/files/fr/web/css/initial-letter/index.html index 016c320d49..898b7ffb7e 100644 --- a/files/fr/web/css/initial-letter/index.html +++ b/files/fr/web/css/initial-letter/index.html @@ -45,7 +45,7 @@ initial-letter: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/inline-size/index.html b/files/fr/web/css/inline-size/index.html index 92610bd499..d424012b88 100644 --- a/files/fr/web/css/inline-size/index.html +++ b/files/fr/web/css/inline-size/index.html @@ -51,7 +51,7 @@ inline-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/inset-block-end/index.html b/files/fr/web/css/inset-block-end/index.html index 68db20d737..3008d926db 100644 --- a/files/fr/web/css/inset-block-end/index.html +++ b/files/fr/web/css/inset-block-end/index.html @@ -46,7 +46,7 @@ inset-block-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/inset-block-start/index.html b/files/fr/web/css/inset-block-start/index.html index 69734863df..2c37c76f76 100644 --- a/files/fr/web/css/inset-block-start/index.html +++ b/files/fr/web/css/inset-block-start/index.html @@ -44,7 +44,7 @@ inset-block-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/inset-block/index.html b/files/fr/web/css/inset-block/index.html index 7ef04b2736..1300ac677c 100644 --- a/files/fr/web/css/inset-block/index.html +++ b/files/fr/web/css/inset-block/index.html @@ -43,7 +43,7 @@ inset-block: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/inset-inline-end/index.html b/files/fr/web/css/inset-inline-end/index.html index edc8e15fda..19695dd64d 100644 --- a/files/fr/web/css/inset-inline-end/index.html +++ b/files/fr/web/css/inset-inline-end/index.html @@ -46,7 +46,7 @@ inset-inline-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/inset-inline-start/index.html b/files/fr/web/css/inset-inline-start/index.html index 8eb72d1bc2..b460cfa3d4 100644 --- a/files/fr/web/css/inset-inline-start/index.html +++ b/files/fr/web/css/inset-inline-start/index.html @@ -46,7 +46,7 @@ inset-inline-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/inset-inline/index.html b/files/fr/web/css/inset-inline/index.html index 7a6f06fbf0..c37cbc1057 100644 --- a/files/fr/web/css/inset-inline/index.html +++ b/files/fr/web/css/inset-inline/index.html @@ -43,7 +43,7 @@ inset-inline: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/inset/index.html b/files/fr/web/css/inset/index.html index bf91e20df5..572e5df765 100644 --- a/files/fr/web/css/inset/index.html +++ b/files/fr/web/css/inset/index.html @@ -41,7 +41,7 @@ inset: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/isolation/index.html b/files/fr/web/css/isolation/index.html index f307209c1d..6ccf991253 100644 --- a/files/fr/web/css/isolation/index.html +++ b/files/fr/web/css/isolation/index.html @@ -43,7 +43,7 @@ isolation: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/justify-content/index.html b/files/fr/web/css/justify-content/index.html index 02d22d44ee..2cf7a71555 100644 --- a/files/fr/web/css/justify-content/index.html +++ b/files/fr/web/css/justify-content/index.html @@ -102,7 +102,7 @@ justify-content: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/justify-items/index.html b/files/fr/web/css/justify-items/index.html index 862d8e697c..36cb2937c4 100644 --- a/files/fr/web/css/justify-items/index.html +++ b/files/fr/web/css/justify-items/index.html @@ -129,7 +129,7 @@ justify-items: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/justify-self/index.html b/files/fr/web/css/justify-self/index.html index d093566da0..b9efe51b93 100644 --- a/files/fr/web/css/justify-self/index.html +++ b/files/fr/web/css/justify-self/index.html @@ -121,7 +121,7 @@ justify-self: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/left/index.html b/files/fr/web/css/left/index.html index e616347698..4a5ecdca93 100644 --- a/files/fr/web/css/left/index.html +++ b/files/fr/web/css/left/index.html @@ -71,7 +71,7 @@ left: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/letter-spacing/index.html b/files/fr/web/css/letter-spacing/index.html index 9a2f305952..40ee214f7f 100644 --- a/files/fr/web/css/letter-spacing/index.html +++ b/files/fr/web/css/letter-spacing/index.html @@ -43,7 +43,7 @@ letter-spacing: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/line-break/index.html b/files/fr/web/css/line-break/index.html index 8395c08a3a..1f18f8ea91 100644 --- a/files/fr/web/css/line-break/index.html +++ b/files/fr/web/css/line-break/index.html @@ -40,7 +40,7 @@ line-break: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/line-height-step/index.html b/files/fr/web/css/line-height-step/index.html index 7006bee134..3ba7b9ae91 100644 --- a/files/fr/web/css/line-height-step/index.html +++ b/files/fr/web/css/line-height-step/index.html @@ -29,7 +29,7 @@ line-height-step: 18pt; <h3 id="Formal_syntax">Formal syntax</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/line-height/index.html b/files/fr/web/css/line-height/index.html index dc8f2b105c..a23aa7ac3a 100644 --- a/files/fr/web/css/line-height/index.html +++ b/files/fr/web/css/line-height/index.html @@ -69,7 +69,7 @@ line-height: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/list-style-image/index.html b/files/fr/web/css/list-style-image/index.html index 5dc240279f..e083df02ba 100644 --- a/files/fr/web/css/list-style-image/index.html +++ b/files/fr/web/css/list-style-image/index.html @@ -44,7 +44,7 @@ list-style-image: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/list-style-position/index.html b/files/fr/web/css/list-style-position/index.html index a9ebac525b..68ac5e2202 100644 --- a/files/fr/web/css/list-style-position/index.html +++ b/files/fr/web/css/list-style-position/index.html @@ -51,7 +51,7 @@ list-style-position: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/list-style-type/index.html b/files/fr/web/css/list-style-type/index.html index fce26cdf01..2e80eddd52 100644 --- a/files/fr/web/css/list-style-type/index.html +++ b/files/fr/web/css/list-style-type/index.html @@ -499,7 +499,7 @@ list-style-type: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/list-style/index.html b/files/fr/web/css/list-style/index.html index 19fcbef3f3..c32cedf2cb 100644 --- a/files/fr/web/css/list-style/index.html +++ b/files/fr/web/css/list-style/index.html @@ -61,7 +61,7 @@ list-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-block-end/index.html b/files/fr/web/css/margin-block-end/index.html index 2634d401ec..c439e31139 100644 --- a/files/fr/web/css/margin-block-end/index.html +++ b/files/fr/web/css/margin-block-end/index.html @@ -40,7 +40,7 @@ margin-block-end: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-block-start/index.html b/files/fr/web/css/margin-block-start/index.html index d7ead1802d..7c4bad9c72 100644 --- a/files/fr/web/css/margin-block-start/index.html +++ b/files/fr/web/css/margin-block-start/index.html @@ -40,7 +40,7 @@ margin-block-start: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-block/index.html b/files/fr/web/css/margin-block/index.html index 8d7482ceae..bd5c59df51 100644 --- a/files/fr/web/css/margin-block/index.html +++ b/files/fr/web/css/margin-block/index.html @@ -39,7 +39,7 @@ margin-block: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-bottom/index.html b/files/fr/web/css/margin-bottom/index.html index 6da12febe9..a7c604c9e4 100644 --- a/files/fr/web/css/margin-bottom/index.html +++ b/files/fr/web/css/margin-bottom/index.html @@ -50,7 +50,7 @@ margin-bottom: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-inline-end/index.html b/files/fr/web/css/margin-inline-end/index.html index a2f3b7c213..1c3d3d8c4b 100644 --- a/files/fr/web/css/margin-inline-end/index.html +++ b/files/fr/web/css/margin-inline-end/index.html @@ -40,7 +40,7 @@ margin-inline-end: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-inline-start/index.html b/files/fr/web/css/margin-inline-start/index.html index 66f62e3a22..2566b8690a 100644 --- a/files/fr/web/css/margin-inline-start/index.html +++ b/files/fr/web/css/margin-inline-start/index.html @@ -40,7 +40,7 @@ margin-inline-start: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-inline/index.html b/files/fr/web/css/margin-inline/index.html index 44ce1a255a..ffde7cee13 100644 --- a/files/fr/web/css/margin-inline/index.html +++ b/files/fr/web/css/margin-inline/index.html @@ -39,7 +39,7 @@ margin-inline: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-left/index.html b/files/fr/web/css/margin-left/index.html index 46fda52a12..e8823d9cd1 100644 --- a/files/fr/web/css/margin-left/index.html +++ b/files/fr/web/css/margin-left/index.html @@ -108,7 +108,7 @@ margin-left: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-right/index.html b/files/fr/web/css/margin-right/index.html index a34a800ead..fe1d00eb62 100644 --- a/files/fr/web/css/margin-right/index.html +++ b/files/fr/web/css/margin-right/index.html @@ -106,7 +106,7 @@ margin-right: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-top/index.html b/files/fr/web/css/margin-top/index.html index 01d930ef85..8a52664489 100644 --- a/files/fr/web/css/margin-top/index.html +++ b/files/fr/web/css/margin-top/index.html @@ -50,7 +50,7 @@ margin-top: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/margin-trim/index.html b/files/fr/web/css/margin-trim/index.html index 1cff4f496c..bee3b9afc8 100644 --- a/files/fr/web/css/margin-trim/index.html +++ b/files/fr/web/css/margin-trim/index.html @@ -30,7 +30,7 @@ translation_of: Web/CSS/margin-trim <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/margin/index.html b/files/fr/web/css/margin/index.html index 6aaf3a899d..dcbb4489ee 100644 --- a/files/fr/web/css/margin/index.html +++ b/files/fr/web/css/margin/index.html @@ -68,7 +68,7 @@ margin: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-border-mode/index.html b/files/fr/web/css/mask-border-mode/index.html index 4b28d66c90..fbd6852427 100644 --- a/files/fr/web/css/mask-border-mode/index.html +++ b/files/fr/web/css/mask-border-mode/index.html @@ -35,7 +35,7 @@ mask-border-mode: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/mask-border-outset/index.html b/files/fr/web/css/mask-border-outset/index.html index 336e8f8c4f..2f4946c56e 100644 --- a/files/fr/web/css/mask-border-outset/index.html +++ b/files/fr/web/css/mask-border-outset/index.html @@ -57,7 +57,7 @@ mask-border-outset: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications" name="Specifications">Spécifications</h2> diff --git a/files/fr/web/css/mask-border-repeat/index.html b/files/fr/web/css/mask-border-repeat/index.html index ac59c27850..eb7c528638 100644 --- a/files/fr/web/css/mask-border-repeat/index.html +++ b/files/fr/web/css/mask-border-repeat/index.html @@ -51,7 +51,7 @@ mask-border-repeat: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications" name="Specifications">Spécifications</h2> diff --git a/files/fr/web/css/mask-border-slice/index.html b/files/fr/web/css/mask-border-slice/index.html index a3020b76fd..2a76433cc7 100644 --- a/files/fr/web/css/mask-border-slice/index.html +++ b/files/fr/web/css/mask-border-slice/index.html @@ -73,7 +73,7 @@ mask-border-slice: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/mask-border-source/index.html b/files/fr/web/css/mask-border-source/index.html index 2b6ffcd553..f03f82be19 100644 --- a/files/fr/web/css/mask-border-source/index.html +++ b/files/fr/web/css/mask-border-source/index.html @@ -40,7 +40,7 @@ mask-border-source: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-border-width/index.html b/files/fr/web/css/mask-border-width/index.html index e10891a78b..ddeb57ee97 100644 --- a/files/fr/web/css/mask-border-width/index.html +++ b/files/fr/web/css/mask-border-width/index.html @@ -66,7 +66,7 @@ mask-border-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications" name="Specifications">Spécifications</h2> diff --git a/files/fr/web/css/mask-border/index.html b/files/fr/web/css/mask-border/index.html index 4695440d10..062f768532 100644 --- a/files/fr/web/css/mask-border/index.html +++ b/files/fr/web/css/mask-border/index.html @@ -49,7 +49,7 @@ mask-border: url('border-mask.png') 25 / 35px / 12px space alpha; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-clip/index.html b/files/fr/web/css/mask-clip/index.html index 33e7499059..081b87c626 100644 --- a/files/fr/web/css/mask-clip/index.html +++ b/files/fr/web/css/mask-clip/index.html @@ -71,7 +71,7 @@ mask-clip: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-composite/index.html b/files/fr/web/css/mask-composite/index.html index 1b4d2be85f..367c91b0a0 100644 --- a/files/fr/web/css/mask-composite/index.html +++ b/files/fr/web/css/mask-composite/index.html @@ -45,7 +45,7 @@ mask-composite: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-image/index.html b/files/fr/web/css/mask-image/index.html index 2a74bb21dc..a549a19ff0 100644 --- a/files/fr/web/css/mask-image/index.html +++ b/files/fr/web/css/mask-image/index.html @@ -46,7 +46,7 @@ mask-image: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-mode/index.html b/files/fr/web/css/mask-mode/index.html index 1f1f49c77b..6157c34266 100644 --- a/files/fr/web/css/mask-mode/index.html +++ b/files/fr/web/css/mask-mode/index.html @@ -47,7 +47,7 @@ mask-mode: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-origin/index.html b/files/fr/web/css/mask-origin/index.html index fdebe34999..082bad1df3 100644 --- a/files/fr/web/css/mask-origin/index.html +++ b/files/fr/web/css/mask-origin/index.html @@ -69,7 +69,7 @@ mask-origin: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-position/index.html b/files/fr/web/css/mask-position/index.html index c5e49fc5c9..6e54f12d13 100644 --- a/files/fr/web/css/mask-position/index.html +++ b/files/fr/web/css/mask-position/index.html @@ -49,7 +49,7 @@ mask-position: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-repeat/index.html b/files/fr/web/css/mask-repeat/index.html index 501cc2e22f..5ae5e6141d 100644 --- a/files/fr/web/css/mask-repeat/index.html +++ b/files/fr/web/css/mask-repeat/index.html @@ -105,7 +105,7 @@ mask-repeat: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-size/index.html b/files/fr/web/css/mask-size/index.html index bbdc192176..19d0ef3380 100644 --- a/files/fr/web/css/mask-size/index.html +++ b/files/fr/web/css/mask-size/index.html @@ -98,7 +98,7 @@ mask-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask-type/index.html b/files/fr/web/css/mask-type/index.html index e62f64e80e..045ac5ff9d 100644 --- a/files/fr/web/css/mask-type/index.html +++ b/files/fr/web/css/mask-type/index.html @@ -37,7 +37,7 @@ mask-type: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/mask/index.html b/files/fr/web/css/mask/index.html index 4a69a1adf8..a6ad02c7a3 100644 --- a/files/fr/web/css/mask/index.html +++ b/files/fr/web/css/mask/index.html @@ -64,7 +64,7 @@ mask: unset; </dt> </dl> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> @@ -80,7 +80,7 @@ mask: unset; <h3 id="CSS">CSS</h3> <pre class="brush: css">.exemple{ - mask:url(https://developer.cdn.mozilla.net/static/img/favicon72.png) luminance 20%; + mask:url(https://developer.mozilla.org/static/img/favicon72.png) luminance 20%; } </pre> diff --git a/files/fr/web/css/max()/index.html b/files/fr/web/css/max()/index.html index 88016899ac..5d8067b1cc 100644 --- a/files/fr/web/css/max()/index.html +++ b/files/fr/web/css/max()/index.html @@ -34,7 +34,7 @@ width: max(10vw, 4em, 80px); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/max-block-size/index.html b/files/fr/web/css/max-block-size/index.html index 775b7f91ed..7323c7e1e8 100644 --- a/files/fr/web/css/max-block-size/index.html +++ b/files/fr/web/css/max-block-size/index.html @@ -83,7 +83,7 @@ max-block-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/max-height/index.html b/files/fr/web/css/max-height/index.html index 9b94e51229..1ce049879b 100644 --- a/files/fr/web/css/max-height/index.html +++ b/files/fr/web/css/max-height/index.html @@ -61,7 +61,7 @@ max-height: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/max-inline-size/index.html b/files/fr/web/css/max-inline-size/index.html index c8fac84ce1..b14098be39 100644 --- a/files/fr/web/css/max-inline-size/index.html +++ b/files/fr/web/css/max-inline-size/index.html @@ -46,7 +46,7 @@ max-inline-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/max-width/index.html b/files/fr/web/css/max-width/index.html index e50a03260b..fb3be5b64e 100644 --- a/files/fr/web/css/max-width/index.html +++ b/files/fr/web/css/max-width/index.html @@ -61,7 +61,7 @@ max-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/min()/index.html b/files/fr/web/css/min()/index.html index 3c948df62a..32e54d793e 100644 --- a/files/fr/web/css/min()/index.html +++ b/files/fr/web/css/min()/index.html @@ -34,7 +34,7 @@ width: min(10vw, 4em, 80px); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/min-block-size/index.html b/files/fr/web/css/min-block-size/index.html index c53032ddfa..76c97f1958 100644 --- a/files/fr/web/css/min-block-size/index.html +++ b/files/fr/web/css/min-block-size/index.html @@ -48,7 +48,7 @@ min-block-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/min-height/index.html b/files/fr/web/css/min-height/index.html index cafd659f5d..10d4e1edad 100644 --- a/files/fr/web/css/min-height/index.html +++ b/files/fr/web/css/min-height/index.html @@ -58,7 +58,7 @@ min-height: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/min-inline-size/index.html b/files/fr/web/css/min-inline-size/index.html index 71ff919c9a..0d34d0cf32 100644 --- a/files/fr/web/css/min-inline-size/index.html +++ b/files/fr/web/css/min-inline-size/index.html @@ -49,7 +49,7 @@ min-inline-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/min-width/index.html b/files/fr/web/css/min-width/index.html index 16337c8f00..ad4cf30852 100644 --- a/files/fr/web/css/min-width/index.html +++ b/files/fr/web/css/min-width/index.html @@ -60,7 +60,7 @@ min-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/minmax()/index.html b/files/fr/web/css/minmax()/index.html index be3492db41..1945c86c70 100644 --- a/files/fr/web/css/minmax()/index.html +++ b/files/fr/web/css/minmax()/index.html @@ -66,7 +66,7 @@ minmax(auto, 300px) <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h3 id="Propriétés_CSS_applicables">Propriétés CSS applicables</h3> diff --git a/files/fr/web/css/mix-blend-mode/index.html b/files/fr/web/css/mix-blend-mode/index.html index c6abaca52a..93e7919d75 100644 --- a/files/fr/web/css/mix-blend-mode/index.html +++ b/files/fr/web/css/mix-blend-mode/index.html @@ -50,7 +50,7 @@ mix-blend-mode: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/object-fit/index.html b/files/fr/web/css/object-fit/index.html index 6d86a4f4b7..d54fdcbde9 100644 --- a/files/fr/web/css/object-fit/index.html +++ b/files/fr/web/css/object-fit/index.html @@ -55,7 +55,7 @@ object-fit: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/object-position/index.html b/files/fr/web/css/object-position/index.html index c87ac86ea9..3ac7d7fad0 100644 --- a/files/fr/web/css/object-position/index.html +++ b/files/fr/web/css/object-position/index.html @@ -41,7 +41,7 @@ object-position: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/offset-anchor/index.html b/files/fr/web/css/offset-anchor/index.html index 2d8f3f0ee5..2f394e3ddc 100644 --- a/files/fr/web/css/offset-anchor/index.html +++ b/files/fr/web/css/offset-anchor/index.html @@ -51,7 +51,7 @@ offset-anchor: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/offset-distance/index.html b/files/fr/web/css/offset-distance/index.html index ea1a89b020..3c14ab1cee 100644 --- a/files/fr/web/css/offset-distance/index.html +++ b/files/fr/web/css/offset-distance/index.html @@ -32,7 +32,7 @@ offset-distance: 40px;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/offset-path/index.html b/files/fr/web/css/offset-path/index.html index 3d6826f621..cb02445e74 100644 --- a/files/fr/web/css/offset-path/index.html +++ b/files/fr/web/css/offset-path/index.html @@ -73,7 +73,7 @@ offset-path: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/offset-position/index.html b/files/fr/web/css/offset-position/index.html index 21b83a9b99..3af7b1e70b 100644 --- a/files/fr/web/css/offset-position/index.html +++ b/files/fr/web/css/offset-position/index.html @@ -52,7 +52,7 @@ offset-position: unset; <h2 id="Syntax_formelle">Syntax formelle</h2> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/offset-rotate/index.html b/files/fr/web/css/offset-rotate/index.html index 4ddd5380c0..f5ca60624f 100644 --- a/files/fr/web/css/offset-rotate/index.html +++ b/files/fr/web/css/offset-rotate/index.html @@ -49,7 +49,7 @@ offset-rotate: .5turn;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/offset/index.html b/files/fr/web/css/offset/index.html index a3fe13e57b..761d8fcf48 100644 --- a/files/fr/web/css/offset/index.html +++ b/files/fr/web/css/offset/index.html @@ -44,7 +44,7 @@ offset: url(arc.svg) 30deg / 50px 100px; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/opacity/index.html b/files/fr/web/css/opacity/index.html index d454141433..8e8260b69c 100644 --- a/files/fr/web/css/opacity/index.html +++ b/files/fr/web/css/opacity/index.html @@ -67,7 +67,7 @@ opacity: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/order/index.html b/files/fr/web/css/order/index.html index 193a043b33..a4ddfad885 100644 --- a/files/fr/web/css/order/index.html +++ b/files/fr/web/css/order/index.html @@ -41,7 +41,7 @@ order: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/orphans/index.html b/files/fr/web/css/orphans/index.html index 8fa838fcac..355a8f06a1 100644 --- a/files/fr/web/css/orphans/index.html +++ b/files/fr/web/css/orphans/index.html @@ -35,7 +35,7 @@ orphans: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/outline-color/index.html b/files/fr/web/css/outline-color/index.html index 9e3bc20978..45245f7747 100644 --- a/files/fr/web/css/outline-color/index.html +++ b/files/fr/web/css/outline-color/index.html @@ -51,7 +51,7 @@ outline-color: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/outline-offset/index.html b/files/fr/web/css/outline-offset/index.html index d46cc50ed6..3e51837560 100644 --- a/files/fr/web/css/outline-offset/index.html +++ b/files/fr/web/css/outline-offset/index.html @@ -37,7 +37,7 @@ outline-offset: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/outline-style/index.html b/files/fr/web/css/outline-style/index.html index d205203a01..2b6eb0d961 100644 --- a/files/fr/web/css/outline-style/index.html +++ b/files/fr/web/css/outline-style/index.html @@ -64,7 +64,7 @@ outline-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/outline-width/index.html b/files/fr/web/css/outline-width/index.html index dd552aa948..30010d5cc0 100644 --- a/files/fr/web/css/outline-width/index.html +++ b/files/fr/web/css/outline-width/index.html @@ -46,7 +46,7 @@ outline-width: inherit; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/outline/index.html b/files/fr/web/css/outline/index.html index 11148a26fa..acaa30c662 100644 --- a/files/fr/web/css/outline/index.html +++ b/files/fr/web/css/outline/index.html @@ -65,7 +65,7 @@ outline: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/overflow-anchor/index.html b/files/fr/web/css/overflow-anchor/index.html index 79327c6f3f..a02eac4b06 100644 --- a/files/fr/web/css/overflow-anchor/index.html +++ b/files/fr/web/css/overflow-anchor/index.html @@ -36,7 +36,7 @@ overflow-anchor: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/overflow-block/index.html b/files/fr/web/css/overflow-block/index.html index f754f76cca..5b31d182e3 100644 --- a/files/fr/web/css/overflow-block/index.html +++ b/files/fr/web/css/overflow-block/index.html @@ -47,7 +47,7 @@ overflow-block: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/overflow-inline/index.html b/files/fr/web/css/overflow-inline/index.html index bbec96456f..418daad231 100644 --- a/files/fr/web/css/overflow-inline/index.html +++ b/files/fr/web/css/overflow-inline/index.html @@ -47,7 +47,7 @@ overflow-inline: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/overflow-wrap/index.html b/files/fr/web/css/overflow-wrap/index.html index 6cde7358d5..61ebe62281 100644 --- a/files/fr/web/css/overflow-wrap/index.html +++ b/files/fr/web/css/overflow-wrap/index.html @@ -48,7 +48,7 @@ overflow-wrap: unset; <dt> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> - <pre class="syntaxbox">{{csssyntax}}</pre> + {{csssyntax}} </dt> </dl> diff --git a/files/fr/web/css/overflow-x/index.html b/files/fr/web/css/overflow-x/index.html index ace75a305c..a9ea011c31 100644 --- a/files/fr/web/css/overflow-x/index.html +++ b/files/fr/web/css/overflow-x/index.html @@ -50,7 +50,7 @@ overflow-x: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/overflow-y/index.html b/files/fr/web/css/overflow-y/index.html index 254e6ceafe..563408d123 100644 --- a/files/fr/web/css/overflow-y/index.html +++ b/files/fr/web/css/overflow-y/index.html @@ -50,7 +50,7 @@ overflow-y: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/overflow/index.html b/files/fr/web/css/overflow/index.html index 2361debd6c..f787f29729 100644 --- a/files/fr/web/css/overflow/index.html +++ b/files/fr/web/css/overflow/index.html @@ -85,7 +85,7 @@ overflow: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/overscroll-behavior-x/index.html b/files/fr/web/css/overscroll-behavior-x/index.html index e061936d92..74623c9cd9 100644 --- a/files/fr/web/css/overscroll-behavior-x/index.html +++ b/files/fr/web/css/overscroll-behavior-x/index.html @@ -44,7 +44,7 @@ overscroll-behavior-x: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/overscroll-behavior-y/index.html b/files/fr/web/css/overscroll-behavior-y/index.html index 5cf1ba394b..0b4ac5adbf 100644 --- a/files/fr/web/css/overscroll-behavior-y/index.html +++ b/files/fr/web/css/overscroll-behavior-y/index.html @@ -44,7 +44,7 @@ overscroll-behavior-y: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/overscroll-behavior/index.html b/files/fr/web/css/overscroll-behavior/index.html index e54eac7aa3..6e4e3c12e7 100644 --- a/files/fr/web/css/overscroll-behavior/index.html +++ b/files/fr/web/css/overscroll-behavior/index.html @@ -49,7 +49,7 @@ overflow: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-block-end/index.html b/files/fr/web/css/padding-block-end/index.html index cc97778ece..52bf4a8ecb 100644 --- a/files/fr/web/css/padding-block-end/index.html +++ b/files/fr/web/css/padding-block-end/index.html @@ -41,7 +41,7 @@ padding-block-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-block-start/index.html b/files/fr/web/css/padding-block-start/index.html index 2af0e4d6fc..54682c9ee9 100644 --- a/files/fr/web/css/padding-block-start/index.html +++ b/files/fr/web/css/padding-block-start/index.html @@ -41,7 +41,7 @@ padding-block-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-block/index.html b/files/fr/web/css/padding-block/index.html index 80025dd82e..c9cd6a3b1a 100644 --- a/files/fr/web/css/padding-block/index.html +++ b/files/fr/web/css/padding-block/index.html @@ -39,7 +39,7 @@ padding-block: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-bottom/index.html b/files/fr/web/css/padding-bottom/index.html index f191ec7c27..dc4c709858 100644 --- a/files/fr/web/css/padding-bottom/index.html +++ b/files/fr/web/css/padding-bottom/index.html @@ -46,7 +46,7 @@ padding-bottom: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-inline-end/index.html b/files/fr/web/css/padding-inline-end/index.html index b226bc62bd..ac8a7891a9 100644 --- a/files/fr/web/css/padding-inline-end/index.html +++ b/files/fr/web/css/padding-inline-end/index.html @@ -41,7 +41,7 @@ padding-inline-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-inline-start/index.html b/files/fr/web/css/padding-inline-start/index.html index 4e3ab291af..39c9b87398 100644 --- a/files/fr/web/css/padding-inline-start/index.html +++ b/files/fr/web/css/padding-inline-start/index.html @@ -41,7 +41,7 @@ padding-inline-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-inline/index.html b/files/fr/web/css/padding-inline/index.html index 380dfcda04..11e60290b0 100644 --- a/files/fr/web/css/padding-inline/index.html +++ b/files/fr/web/css/padding-inline/index.html @@ -39,7 +39,7 @@ padding-inline: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-left/index.html b/files/fr/web/css/padding-left/index.html index 164ce17636..1d87a957ec 100644 --- a/files/fr/web/css/padding-left/index.html +++ b/files/fr/web/css/padding-left/index.html @@ -46,7 +46,7 @@ padding-left: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-right/index.html b/files/fr/web/css/padding-right/index.html index bdc3db6f3b..0482708873 100644 --- a/files/fr/web/css/padding-right/index.html +++ b/files/fr/web/css/padding-right/index.html @@ -48,7 +48,7 @@ padding-right: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding-top/index.html b/files/fr/web/css/padding-top/index.html index 076e4a9f04..acfe93d401 100644 --- a/files/fr/web/css/padding-top/index.html +++ b/files/fr/web/css/padding-top/index.html @@ -48,7 +48,7 @@ padding-top: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/padding/index.html b/files/fr/web/css/padding/index.html index e5b53a52e6..f01b27c82f 100644 --- a/files/fr/web/css/padding/index.html +++ b/files/fr/web/css/padding/index.html @@ -64,7 +64,7 @@ padding: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/page-break-after/index.html b/files/fr/web/css/page-break-after/index.html index 3d88e13bf6..a400a63acf 100644 --- a/files/fr/web/css/page-break-after/index.html +++ b/files/fr/web/css/page-break-after/index.html @@ -92,7 +92,7 @@ page-break-after: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/page-break-before/index.html b/files/fr/web/css/page-break-before/index.html index d6e1df056d..d12504b6bc 100644 --- a/files/fr/web/css/page-break-before/index.html +++ b/files/fr/web/css/page-break-before/index.html @@ -90,7 +90,7 @@ page-break-before: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/page-break-inside/index.html b/files/fr/web/css/page-break-inside/index.html index cf16f15c01..406a4a37c9 100644 --- a/files/fr/web/css/page-break-inside/index.html +++ b/files/fr/web/css/page-break-inside/index.html @@ -38,7 +38,7 @@ page-break-inside: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Alias_avec_break-inside">Alias avec <code>break-inside</code></h2> diff --git a/files/fr/web/css/paint-order/index.html b/files/fr/web/css/paint-order/index.html index 3e0e34f287..0859e7dbca 100644 --- a/files/fr/web/css/paint-order/index.html +++ b/files/fr/web/css/paint-order/index.html @@ -58,7 +58,7 @@ paint-order: markers stroke fill; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/perspective-origin/index.html b/files/fr/web/css/perspective-origin/index.html index 6505dac1ab..78a8112485 100644 --- a/files/fr/web/css/perspective-origin/index.html +++ b/files/fr/web/css/perspective-origin/index.html @@ -62,7 +62,7 @@ perspective-origin: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/perspective/index.html b/files/fr/web/css/perspective/index.html index 6569ee0add..18eefda4a0 100644 --- a/files/fr/web/css/perspective/index.html +++ b/files/fr/web/css/perspective/index.html @@ -49,7 +49,7 @@ perspective: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/place-content/index.html b/files/fr/web/css/place-content/index.html index d1817fbb81..caf3ab13c4 100644 --- a/files/fr/web/css/place-content/index.html +++ b/files/fr/web/css/place-content/index.html @@ -83,7 +83,7 @@ place-content: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/place-items/index.html b/files/fr/web/css/place-items/index.html index b9a2608334..443e53e9cc 100644 --- a/files/fr/web/css/place-items/index.html +++ b/files/fr/web/css/place-items/index.html @@ -91,7 +91,7 @@ place-items: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/place-self/index.html b/files/fr/web/css/place-self/index.html index d7d96613fd..ae8f62e3c1 100644 --- a/files/fr/web/css/place-self/index.html +++ b/files/fr/web/css/place-self/index.html @@ -81,7 +81,7 @@ place-self: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{CSSSyntax}}</pre> +{{CSSSyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/pointer-events/index.html b/files/fr/web/css/pointer-events/index.html index 8d2b91dc73..83a54f942e 100644 --- a/files/fr/web/css/pointer-events/index.html +++ b/files/fr/web/css/pointer-events/index.html @@ -72,7 +72,7 @@ pointer-events: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/position/index.html b/files/fr/web/css/position/index.html index d1ab95d2ec..95ce75ff16 100644 --- a/files/fr/web/css/position/index.html +++ b/files/fr/web/css/position/index.html @@ -71,7 +71,7 @@ position: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/quotes/index.html b/files/fr/web/css/quotes/index.html index 00bc1a176b..6ee966accb 100644 --- a/files/fr/web/css/quotes/index.html +++ b/files/fr/web/css/quotes/index.html @@ -44,7 +44,7 @@ quotes: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/repeat()/index.html b/files/fr/web/css/repeat()/index.html index 17ef02d2f8..80f1484b1c 100644 --- a/files/fr/web/css/repeat()/index.html +++ b/files/fr/web/css/repeat()/index.html @@ -76,7 +76,7 @@ repeat(4, 10px [col-start] 30% [col-middle] 400px [col-end]) <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/repeating-radial-gradient()/index.html b/files/fr/web/css/repeating-radial-gradient()/index.html index eae482b540..ef48bef118 100644 --- a/files/fr/web/css/repeating-radial-gradient()/index.html +++ b/files/fr/web/css/repeating-radial-gradient()/index.html @@ -78,7 +78,7 @@ repeating-radial-gradient(farthest-corner at 20% 20%, red 0, green, red 20%); <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/resize/index.html b/files/fr/web/css/resize/index.html index 3b215af7ef..c93b6ac5d1 100644 --- a/files/fr/web/css/resize/index.html +++ b/files/fr/web/css/resize/index.html @@ -54,7 +54,7 @@ resize: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/right/index.html b/files/fr/web/css/right/index.html index f0dc4cbc85..95010cad01 100644 --- a/files/fr/web/css/right/index.html +++ b/files/fr/web/css/right/index.html @@ -71,7 +71,7 @@ right: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/rotate/index.html b/files/fr/web/css/rotate/index.html index 66b5d0819b..a10843cd79 100644 --- a/files/fr/web/css/rotate/index.html +++ b/files/fr/web/css/rotate/index.html @@ -44,7 +44,7 @@ rotate: 1 1 1 90deg;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/row-gap/index.html b/files/fr/web/css/row-gap/index.html index b4f88ab37e..a6d36c5ecb 100644 --- a/files/fr/web/css/row-gap/index.html +++ b/files/fr/web/css/row-gap/index.html @@ -47,7 +47,7 @@ row-gap: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/ruby-align/index.html b/files/fr/web/css/ruby-align/index.html index 589f6a46a6..b5c4bfb7cc 100644 --- a/files/fr/web/css/ruby-align/index.html +++ b/files/fr/web/css/ruby-align/index.html @@ -41,7 +41,7 @@ ruby-align: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/ruby-position/index.html b/files/fr/web/css/ruby-position/index.html index bb0ec85090..891e62c572 100644 --- a/files/fr/web/css/ruby-position/index.html +++ b/files/fr/web/css/ruby-position/index.html @@ -38,7 +38,7 @@ ruby-position: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scale/index.html b/files/fr/web/css/scale/index.html index dfece432da..8ca113ca6c 100644 --- a/files/fr/web/css/scale/index.html +++ b/files/fr/web/css/scale/index.html @@ -43,7 +43,7 @@ scale: 2 0.5 2;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scroll-behavior/index.html b/files/fr/web/css/scroll-behavior/index.html index 75791bd495..b97595daa9 100644 --- a/files/fr/web/css/scroll-behavior/index.html +++ b/files/fr/web/css/scroll-behavior/index.html @@ -45,7 +45,7 @@ scroll-behavior: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scroll-margin-block-end/index.html b/files/fr/web/css/scroll-margin-block-end/index.html index db70841cd0..0850ddbeb1 100644 --- a/files/fr/web/css/scroll-margin-block-end/index.html +++ b/files/fr/web/css/scroll-margin-block-end/index.html @@ -38,7 +38,7 @@ scroll-margin-block-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin-block-start/index.html b/files/fr/web/css/scroll-margin-block-start/index.html index 58a7dcf83a..352dcc5505 100644 --- a/files/fr/web/css/scroll-margin-block-start/index.html +++ b/files/fr/web/css/scroll-margin-block-start/index.html @@ -39,7 +39,7 @@ scroll-margin-block-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin-block/index.html b/files/fr/web/css/scroll-margin-block/index.html index e032413d5b..5af9c65676 100644 --- a/files/fr/web/css/scroll-margin-block/index.html +++ b/files/fr/web/css/scroll-margin-block/index.html @@ -41,7 +41,7 @@ scroll-margin-block: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin-bottom/index.html b/files/fr/web/css/scroll-margin-bottom/index.html index 53c85231a0..acf4a793d6 100644 --- a/files/fr/web/css/scroll-margin-bottom/index.html +++ b/files/fr/web/css/scroll-margin-bottom/index.html @@ -39,7 +39,7 @@ scroll-margin-bottom: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin-inline-end/index.html b/files/fr/web/css/scroll-margin-inline-end/index.html index 91062d05bf..13621db3e1 100644 --- a/files/fr/web/css/scroll-margin-inline-end/index.html +++ b/files/fr/web/css/scroll-margin-inline-end/index.html @@ -39,7 +39,7 @@ scroll-margin-inline-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin-inline-start/index.html b/files/fr/web/css/scroll-margin-inline-start/index.html index eed1eb99f3..ccbf07df5d 100644 --- a/files/fr/web/css/scroll-margin-inline-start/index.html +++ b/files/fr/web/css/scroll-margin-inline-start/index.html @@ -39,7 +39,7 @@ scroll-margin-inline-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin-inline/index.html b/files/fr/web/css/scroll-margin-inline/index.html index 2f1d7507b4..aedc869f7c 100644 --- a/files/fr/web/css/scroll-margin-inline/index.html +++ b/files/fr/web/css/scroll-margin-inline/index.html @@ -37,7 +37,7 @@ scroll-margin-inline: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin-left/index.html b/files/fr/web/css/scroll-margin-left/index.html index 557fc01916..f05f174528 100644 --- a/files/fr/web/css/scroll-margin-left/index.html +++ b/files/fr/web/css/scroll-margin-left/index.html @@ -38,7 +38,7 @@ scroll-margin-left: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin-right/index.html b/files/fr/web/css/scroll-margin-right/index.html index 56e7a9be1a..8bbc93ea6a 100644 --- a/files/fr/web/css/scroll-margin-right/index.html +++ b/files/fr/web/css/scroll-margin-right/index.html @@ -38,7 +38,7 @@ scroll-margin-right: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin-top/index.html b/files/fr/web/css/scroll-margin-top/index.html index 5e435abef0..b012c6b421 100644 --- a/files/fr/web/css/scroll-margin-top/index.html +++ b/files/fr/web/css/scroll-margin-top/index.html @@ -37,7 +37,7 @@ scroll-margin-top: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-margin/index.html b/files/fr/web/css/scroll-margin/index.html index 007adfd400..4e2d375fa5 100644 --- a/files/fr/web/css/scroll-margin/index.html +++ b/files/fr/web/css/scroll-margin/index.html @@ -40,7 +40,7 @@ scroll-margin: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-padding-block-end/index.html b/files/fr/web/css/scroll-padding-block-end/index.html index 26d40884ff..65bdf363ce 100644 --- a/files/fr/web/css/scroll-padding-block-end/index.html +++ b/files/fr/web/css/scroll-padding-block-end/index.html @@ -48,7 +48,7 @@ scroll-padding-block-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-padding-block-start/index.html b/files/fr/web/css/scroll-padding-block-start/index.html index e52e1cf2af..0b9cada92a 100644 --- a/files/fr/web/css/scroll-padding-block-start/index.html +++ b/files/fr/web/css/scroll-padding-block-start/index.html @@ -48,7 +48,7 @@ scroll-padding-block-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-padding-block/index.html b/files/fr/web/css/scroll-padding-block/index.html index 0537332219..1fb92c6059 100644 --- a/files/fr/web/css/scroll-padding-block/index.html +++ b/files/fr/web/css/scroll-padding-block/index.html @@ -47,7 +47,7 @@ scroll-padding-block: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-padding-bottom/index.html b/files/fr/web/css/scroll-padding-bottom/index.html index 038a5ead65..9161552b35 100644 --- a/files/fr/web/css/scroll-padding-bottom/index.html +++ b/files/fr/web/css/scroll-padding-bottom/index.html @@ -47,7 +47,7 @@ scroll-padding-bottom: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-padding-inline-end/index.html b/files/fr/web/css/scroll-padding-inline-end/index.html index 610cf71fd0..85eca96630 100644 --- a/files/fr/web/css/scroll-padding-inline-end/index.html +++ b/files/fr/web/css/scroll-padding-inline-end/index.html @@ -48,7 +48,7 @@ scroll-padding-inline-end: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-padding-inline-start/index.html b/files/fr/web/css/scroll-padding-inline-start/index.html index 4c13252345..678cdbb325 100644 --- a/files/fr/web/css/scroll-padding-inline-start/index.html +++ b/files/fr/web/css/scroll-padding-inline-start/index.html @@ -48,7 +48,7 @@ scroll-padding-inline-start: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-padding-inline/index.html b/files/fr/web/css/scroll-padding-inline/index.html index 642fa78f58..eb6c7598cf 100644 --- a/files/fr/web/css/scroll-padding-inline/index.html +++ b/files/fr/web/css/scroll-padding-inline/index.html @@ -48,7 +48,7 @@ scroll-padding-inline: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-padding-left/index.html b/files/fr/web/css/scroll-padding-left/index.html index 4cd58ee8a7..b6fba191c3 100644 --- a/files/fr/web/css/scroll-padding-left/index.html +++ b/files/fr/web/css/scroll-padding-left/index.html @@ -47,7 +47,7 @@ scroll-padding-left: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-padding-right/index.html b/files/fr/web/css/scroll-padding-right/index.html index 135dd97e41..cb65d30882 100644 --- a/files/fr/web/css/scroll-padding-right/index.html +++ b/files/fr/web/css/scroll-padding-right/index.html @@ -45,7 +45,7 @@ scroll-padding-right: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-padding-top/index.html b/files/fr/web/css/scroll-padding-top/index.html index 72bea4927f..068e288b6d 100644 --- a/files/fr/web/css/scroll-padding-top/index.html +++ b/files/fr/web/css/scroll-padding-top/index.html @@ -46,7 +46,7 @@ scroll-padding-top: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-padding/index.html b/files/fr/web/css/scroll-padding/index.html index 533f712e98..34f0dab8c1 100644 --- a/files/fr/web/css/scroll-padding/index.html +++ b/files/fr/web/css/scroll-padding/index.html @@ -46,7 +46,7 @@ scroll-padding: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Specifications">Specifications</h2> diff --git a/files/fr/web/css/scroll-snap-align/index.html b/files/fr/web/css/scroll-snap-align/index.html index e47b84f197..395e571afc 100644 --- a/files/fr/web/css/scroll-snap-align/index.html +++ b/files/fr/web/css/scroll-snap-align/index.html @@ -39,7 +39,7 @@ scroll-snap-align: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/scroll-snap-coordinate/index.html b/files/fr/web/css/scroll-snap-coordinate/index.html index dbfa4f05c3..a9e85c4c38 100644 --- a/files/fr/web/css/scroll-snap-coordinate/index.html +++ b/files/fr/web/css/scroll-snap-coordinate/index.html @@ -42,7 +42,7 @@ scroll-snap-coordinate: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scroll-snap-destination/index.html b/files/fr/web/css/scroll-snap-destination/index.html index 032eb7846e..e10f710555 100644 --- a/files/fr/web/css/scroll-snap-destination/index.html +++ b/files/fr/web/css/scroll-snap-destination/index.html @@ -32,7 +32,7 @@ scroll-snap-destination: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scroll-snap-points-x/index.html b/files/fr/web/css/scroll-snap-points-x/index.html index b7f1acea8b..15b30a87d6 100644 --- a/files/fr/web/css/scroll-snap-points-x/index.html +++ b/files/fr/web/css/scroll-snap-points-x/index.html @@ -37,7 +37,7 @@ scroll-snap-points-x: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scroll-snap-points-y/index.html b/files/fr/web/css/scroll-snap-points-y/index.html index a7570fcd75..fc66bf8b91 100644 --- a/files/fr/web/css/scroll-snap-points-y/index.html +++ b/files/fr/web/css/scroll-snap-points-y/index.html @@ -38,7 +38,7 @@ scroll-snap-points-y: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scroll-snap-stop/index.html b/files/fr/web/css/scroll-snap-stop/index.html index 9d08d3a4d0..328bed4c0c 100644 --- a/files/fr/web/css/scroll-snap-stop/index.html +++ b/files/fr/web/css/scroll-snap-stop/index.html @@ -34,7 +34,7 @@ scroll-snap-type: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scroll-snap-type/index.html b/files/fr/web/css/scroll-snap-type/index.html index d8a49404a1..dfcfb0c971 100644 --- a/files/fr/web/css/scroll-snap-type/index.html +++ b/files/fr/web/css/scroll-snap-type/index.html @@ -64,7 +64,7 @@ scroll-snap-type: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scrollbar-color/index.html b/files/fr/web/css/scrollbar-color/index.html index 211f21b634..52d46fc08b 100644 --- a/files/fr/web/css/scrollbar-color/index.html +++ b/files/fr/web/css/scrollbar-color/index.html @@ -73,7 +73,7 @@ scrollbar-color: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/scrollbar-width/index.html b/files/fr/web/css/scrollbar-width/index.html index 2cd1714b7e..face53c1d9 100644 --- a/files/fr/web/css/scrollbar-width/index.html +++ b/files/fr/web/css/scrollbar-width/index.html @@ -63,7 +63,7 @@ scrollbar-width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/shape-image-threshold/index.html b/files/fr/web/css/shape-image-threshold/index.html index b4a32531a6..bc4a13ca1c 100644 --- a/files/fr/web/css/shape-image-threshold/index.html +++ b/files/fr/web/css/shape-image-threshold/index.html @@ -39,7 +39,7 @@ shape-image-threshold: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/shape-margin/index.html b/files/fr/web/css/shape-margin/index.html index aeae58a570..09b1eddc5c 100644 --- a/files/fr/web/css/shape-margin/index.html +++ b/files/fr/web/css/shape-margin/index.html @@ -43,7 +43,7 @@ shape-margin: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/shape-outside/index.html b/files/fr/web/css/shape-outside/index.html index f759a838c5..f4a579161a 100644 --- a/files/fr/web/css/shape-outside/index.html +++ b/files/fr/web/css/shape-outside/index.html @@ -60,7 +60,7 @@ shape-outside: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Interpolation">Interpolation</h2> diff --git a/files/fr/web/css/tab-size/index.html b/files/fr/web/css/tab-size/index.html index 61b80c16e2..5c451814d6 100644 --- a/files/fr/web/css/tab-size/index.html +++ b/files/fr/web/css/tab-size/index.html @@ -43,7 +43,7 @@ tab-size: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/table-layout/index.html b/files/fr/web/css/table-layout/index.html index d6c9238751..7fa55b46e7 100644 --- a/files/fr/web/css/table-layout/index.html +++ b/files/fr/web/css/table-layout/index.html @@ -40,7 +40,7 @@ table-layout: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-align-last/index.html b/files/fr/web/css/text-align-last/index.html index a0f42f8863..35f9a32615 100644 --- a/files/fr/web/css/text-align-last/index.html +++ b/files/fr/web/css/text-align-last/index.html @@ -53,7 +53,7 @@ text-align-last: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-align/index.html b/files/fr/web/css/text-align/index.html index 50e54360ba..a2229f1c08 100644 --- a/files/fr/web/css/text-align/index.html +++ b/files/fr/web/css/text-align/index.html @@ -69,7 +69,7 @@ text-align: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-combine-upright/index.html b/files/fr/web/css/text-combine-upright/index.html index 3041435d0e..50c2fcf0d1 100644 --- a/files/fr/web/css/text-combine-upright/index.html +++ b/files/fr/web/css/text-combine-upright/index.html @@ -48,7 +48,7 @@ text-combine-upright: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-decoration-color/index.html b/files/fr/web/css/text-decoration-color/index.html index 1abd04f003..0f0698bc13 100644 --- a/files/fr/web/css/text-decoration-color/index.html +++ b/files/fr/web/css/text-decoration-color/index.html @@ -52,7 +52,7 @@ text-decoration-color: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-decoration-line/index.html b/files/fr/web/css/text-decoration-line/index.html index 8b54586657..651450c746 100644 --- a/files/fr/web/css/text-decoration-line/index.html +++ b/files/fr/web/css/text-decoration-line/index.html @@ -54,7 +54,7 @@ text-decoration-line: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-decoration-skip-ink/index.html b/files/fr/web/css/text-decoration-skip-ink/index.html index 862eccec08..beb8aa4229 100644 --- a/files/fr/web/css/text-decoration-skip-ink/index.html +++ b/files/fr/web/css/text-decoration-skip-ink/index.html @@ -37,7 +37,7 @@ text-decoration-skip: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-decoration-skip/index.html b/files/fr/web/css/text-decoration-skip/index.html index 39d8c49dfa..f2ed6d9173 100644 --- a/files/fr/web/css/text-decoration-skip/index.html +++ b/files/fr/web/css/text-decoration-skip/index.html @@ -58,7 +58,7 @@ text-decoration-skip: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-decoration-style/index.html b/files/fr/web/css/text-decoration-style/index.html index 28db746152..0660f94668 100644 --- a/files/fr/web/css/text-decoration-style/index.html +++ b/files/fr/web/css/text-decoration-style/index.html @@ -55,7 +55,7 @@ text-decoration-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-decoration-thickness/index.html b/files/fr/web/css/text-decoration-thickness/index.html index ee195ade44..31e4448fe8 100644 --- a/files/fr/web/css/text-decoration-thickness/index.html +++ b/files/fr/web/css/text-decoration-thickness/index.html @@ -40,7 +40,7 @@ text-decoration-thickness: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-decoration/index.html b/files/fr/web/css/text-decoration/index.html index c9c37513a5..c163a5fdcc 100644 --- a/files/fr/web/css/text-decoration/index.html +++ b/files/fr/web/css/text-decoration/index.html @@ -49,7 +49,7 @@ text-decoration: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-emphasis-color/index.html b/files/fr/web/css/text-emphasis-color/index.html index 5b6f24d086..f8ee8a2386 100644 --- a/files/fr/web/css/text-emphasis-color/index.html +++ b/files/fr/web/css/text-emphasis-color/index.html @@ -38,8 +38,7 @@ text-emphasis-color: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-emphasis-position/index.html b/files/fr/web/css/text-emphasis-position/index.html index 2dfa5fb7cb..80f949a6c1 100644 --- a/files/fr/web/css/text-emphasis-position/index.html +++ b/files/fr/web/css/text-emphasis-position/index.html @@ -88,8 +88,7 @@ text-emphasis-position: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-emphasis-style/index.html b/files/fr/web/css/text-emphasis-style/index.html index 950aef3ddc..f823551575 100644 --- a/files/fr/web/css/text-emphasis-style/index.html +++ b/files/fr/web/css/text-emphasis-style/index.html @@ -60,8 +60,7 @@ text-emphasis-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-emphasis/index.html b/files/fr/web/css/text-emphasis/index.html index cf604b5fd5..da5b5b8104 100644 --- a/files/fr/web/css/text-emphasis/index.html +++ b/files/fr/web/css/text-emphasis/index.html @@ -80,8 +80,7 @@ text-emphasis: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-indent/index.html b/files/fr/web/css/text-indent/index.html index de7e3f2b7f..9201cfcdfd 100644 --- a/files/fr/web/css/text-indent/index.html +++ b/files/fr/web/css/text-indent/index.html @@ -56,7 +56,7 @@ text-indent: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-justify/index.html b/files/fr/web/css/text-justify/index.html index 65e314a68d..b4ff1e800c 100644 --- a/files/fr/web/css/text-justify/index.html +++ b/files/fr/web/css/text-justify/index.html @@ -41,7 +41,7 @@ text-justify: distribute; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-orientation/index.html b/files/fr/web/css/text-orientation/index.html index adf52e134b..ccf08bd906 100644 --- a/files/fr/web/css/text-orientation/index.html +++ b/files/fr/web/css/text-orientation/index.html @@ -51,7 +51,7 @@ text-orientation: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-overflow/index.html b/files/fr/web/css/text-overflow/index.html index cd18e2e925..b2b812936c 100644 --- a/files/fr/web/css/text-overflow/index.html +++ b/files/fr/web/css/text-overflow/index.html @@ -78,7 +78,7 @@ text-overflow: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-rendering/index.html b/files/fr/web/css/text-rendering/index.html index 94c1706c49..25da2619ff 100644 --- a/files/fr/web/css/text-rendering/index.html +++ b/files/fr/web/css/text-rendering/index.html @@ -57,7 +57,7 @@ text-rendering: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-shadow/index.html b/files/fr/web/css/text-shadow/index.html index af5d743c79..50473a336b 100644 --- a/files/fr/web/css/text-shadow/index.html +++ b/files/fr/web/css/text-shadow/index.html @@ -60,7 +60,7 @@ text-shadow: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-size-adjust/index.html b/files/fr/web/css/text-size-adjust/index.html index 724f0ac75c..80c32f8114 100644 --- a/files/fr/web/css/text-size-adjust/index.html +++ b/files/fr/web/css/text-size-adjust/index.html @@ -50,7 +50,7 @@ text-size-adjust: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/text-transform/index.html b/files/fr/web/css/text-transform/index.html index ecba436b31..743fd6d32b 100644 --- a/files/fr/web/css/text-transform/index.html +++ b/files/fr/web/css/text-transform/index.html @@ -76,7 +76,7 @@ text-transform: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-underline-offset/index.html b/files/fr/web/css/text-underline-offset/index.html index b62f7eb7e6..b4f47df714 100644 --- a/files/fr/web/css/text-underline-offset/index.html +++ b/files/fr/web/css/text-underline-offset/index.html @@ -47,7 +47,7 @@ text-underline-offset: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/text-underline-position/index.html b/files/fr/web/css/text-underline-position/index.html index 09bbd3b97d..d8353ef6f7 100644 --- a/files/fr/web/css/text-underline-position/index.html +++ b/files/fr/web/css/text-underline-position/index.html @@ -59,7 +59,7 @@ text-underline-position: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/top/index.html b/files/fr/web/css/top/index.html index 64d8a462c4..2705e0bef3 100644 --- a/files/fr/web/css/top/index.html +++ b/files/fr/web/css/top/index.html @@ -71,7 +71,7 @@ top: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/touch-action/index.html b/files/fr/web/css/touch-action/index.html index f76ced27d0..9f9b126d8b 100644 --- a/files/fr/web/css/touch-action/index.html +++ b/files/fr/web/css/touch-action/index.html @@ -71,7 +71,7 @@ touch-action: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/transform-box/index.html b/files/fr/web/css/transform-box/index.html index 7f040e8636..0896bfec46 100644 --- a/files/fr/web/css/transform-box/index.html +++ b/files/fr/web/css/transform-box/index.html @@ -41,7 +41,7 @@ transform-box: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/transform-origin/index.html b/files/fr/web/css/transform-origin/index.html index 986fc41f6c..3287f3ca43 100644 --- a/files/fr/web/css/transform-origin/index.html +++ b/files/fr/web/css/transform-origin/index.html @@ -148,7 +148,7 @@ transform-origin: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/transform-style/index.html b/files/fr/web/css/transform-style/index.html index 7aa0e24ccc..5f91d4064a 100644 --- a/files/fr/web/css/transform-style/index.html +++ b/files/fr/web/css/transform-style/index.html @@ -44,7 +44,7 @@ transform-style: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/css/transform/index.html b/files/fr/web/css/transform/index.html index adde4477a9..b20f27b4c5 100644 --- a/files/fr/web/css/transform/index.html +++ b/files/fr/web/css/transform/index.html @@ -78,7 +78,7 @@ transform: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <div class="blockIndicator note"> <p><strong>Note :</strong> Si on utilise plusieurs fonctions dont <code><a href="/fr/docs/Web/CSS/transform-function/perspective">perspective()</a></code>, celle-ci devra apparaître en premier.</p> diff --git a/files/fr/web/css/transition-delay/index.html b/files/fr/web/css/transition-delay/index.html index 7f1053f8c2..113e1c26b5 100644 --- a/files/fr/web/css/transition-delay/index.html +++ b/files/fr/web/css/transition-delay/index.html @@ -48,7 +48,7 @@ transition-delay: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/transition-duration/index.html b/files/fr/web/css/transition-duration/index.html index a859c23f3f..bb1e3c35a3 100644 --- a/files/fr/web/css/transition-duration/index.html +++ b/files/fr/web/css/transition-duration/index.html @@ -42,7 +42,7 @@ transition-duration: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/transition-property/index.html b/files/fr/web/css/transition-property/index.html index fe6981f42c..2e75eadf98 100644 --- a/files/fr/web/css/transition-property/index.html +++ b/files/fr/web/css/transition-property/index.html @@ -56,7 +56,7 @@ transition-property: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/transition-timing-function/index.html b/files/fr/web/css/transition-timing-function/index.html index 6e019efdcb..8369a80d20 100644 --- a/files/fr/web/css/transition-timing-function/index.html +++ b/files/fr/web/css/transition-timing-function/index.html @@ -105,7 +105,7 @@ transition-timing-function: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/transition/index.html b/files/fr/web/css/transition/index.html index b195fff18f..9af44b0a06 100644 --- a/files/fr/web/css/transition/index.html +++ b/files/fr/web/css/transition/index.html @@ -65,7 +65,7 @@ transition: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/translate/index.html b/files/fr/web/css/translate/index.html index abe509dcce..6ab997dc91 100644 --- a/files/fr/web/css/translate/index.html +++ b/files/fr/web/css/translate/index.html @@ -44,7 +44,7 @@ translate: 50% 105px 5rem; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/unicode-bidi/index.html b/files/fr/web/css/unicode-bidi/index.html index b7ef1080bf..d906614141 100644 --- a/files/fr/web/css/unicode-bidi/index.html +++ b/files/fr/web/css/unicode-bidi/index.html @@ -53,7 +53,7 @@ unicode-bidi: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/user-modify/index.html b/files/fr/web/css/user-modify/index.html index da8d61685a..3ac5eb65e4 100644 --- a/files/fr/web/css/user-modify/index.html +++ b/files/fr/web/css/user-modify/index.html @@ -48,7 +48,7 @@ user-modify: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/user-select/index.html b/files/fr/web/css/user-select/index.html index 1024770ab4..3ea12e71e0 100644 --- a/files/fr/web/css/user-select/index.html +++ b/files/fr/web/css/user-select/index.html @@ -71,7 +71,7 @@ user-select: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/var()/index.html b/files/fr/web/css/var()/index.html index 0fb388e2f0..502a237d20 100644 --- a/files/fr/web/css/var()/index.html +++ b/files/fr/web/css/var()/index.html @@ -21,8 +21,7 @@ translation_of: Web/CSS/var() <p>Le premier argument de la fonction est le nom de la propriété qu'on veut substituer. Le deuxième argument, optionnel, est une valeur de recours (<em>fallback</em>) qui est utilisée au cas où la valeur de subsitution référencée par la propriété est invalide.</p> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <div class="note"> <p><strong>Note :</strong> La syntaxe de la valeur de recours permet d'utiliser des virgules. Aussi, si on a <code>var(--toto, red, blue)</code>, la valeur de recours sera bien <code>red, blue</code> (autrement dit, tout ce qui est situé après la première virgule sert de valeur de recours).</p> diff --git a/files/fr/web/css/vertical-align/index.html b/files/fr/web/css/vertical-align/index.html index 88319dc526..85aeb15582 100644 --- a/files/fr/web/css/vertical-align/index.html +++ b/files/fr/web/css/vertical-align/index.html @@ -104,7 +104,7 @@ vertical-align: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/visibility/index.html b/files/fr/web/css/visibility/index.html index 8d75cc5fb2..b7685b8d13 100644 --- a/files/fr/web/css/visibility/index.html +++ b/files/fr/web/css/visibility/index.html @@ -54,7 +54,7 @@ visibility: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Interpolation">Interpolation</h2> diff --git a/files/fr/web/css/white-space/index.html b/files/fr/web/css/white-space/index.html index f283a49408..63f5b0c140 100644 --- a/files/fr/web/css/white-space/index.html +++ b/files/fr/web/css/white-space/index.html @@ -114,7 +114,7 @@ white-space: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/widows/index.html b/files/fr/web/css/widows/index.html index 991a6f8a38..69aa55e207 100644 --- a/files/fr/web/css/widows/index.html +++ b/files/fr/web/css/widows/index.html @@ -37,7 +37,7 @@ widows: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/width/index.html b/files/fr/web/css/width/index.html index 1ac1058848..bc877c6dcd 100644 --- a/files/fr/web/css/width/index.html +++ b/files/fr/web/css/width/index.html @@ -84,7 +84,7 @@ width: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/will-change/index.html b/files/fr/web/css/will-change/index.html index 177af45c33..7a8e2e1848 100644 --- a/files/fr/web/css/will-change/index.html +++ b/files/fr/web/css/will-change/index.html @@ -71,7 +71,7 @@ will-change: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox notranslate">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/word-break/index.html b/files/fr/web/css/word-break/index.html index 36f25e5028..c19f368508 100644 --- a/files/fr/web/css/word-break/index.html +++ b/files/fr/web/css/word-break/index.html @@ -50,7 +50,7 @@ word-break: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/word-spacing/index.html b/files/fr/web/css/word-spacing/index.html index 808ec87c68..2281221a51 100644 --- a/files/fr/web/css/word-spacing/index.html +++ b/files/fr/web/css/word-spacing/index.html @@ -49,7 +49,7 @@ word-spacing: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/writing-mode/index.html b/files/fr/web/css/writing-mode/index.html index 6fb8e222ca..017d8a7495 100644 --- a/files/fr/web/css/writing-mode/index.html +++ b/files/fr/web/css/writing-mode/index.html @@ -60,7 +60,7 @@ writing-mode: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemple">Exemple</h2> diff --git a/files/fr/web/css/z-index/index.html b/files/fr/web/css/z-index/index.html index 854cf50eff..f2bf70cb19 100644 --- a/files/fr/web/css/z-index/index.html +++ b/files/fr/web/css/z-index/index.html @@ -58,7 +58,7 @@ z-index: unset; <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}}</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/css/zoom/index.html b/files/fr/web/css/zoom/index.html index d68f95a128..1c827255c0 100644 --- a/files/fr/web/css/zoom/index.html +++ b/files/fr/web/css/zoom/index.html @@ -48,8 +48,7 @@ zoom: unset;</pre> <h3 id="Syntaxe_formelle">Syntaxe formelle</h3> -<pre class="syntaxbox">{{csssyntax}} -</pre> +{{csssyntax}} <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/events/index.html b/files/fr/web/events/index.html index 639201c6ed..30dbf14f75 100644 --- a/files/fr/web/events/index.html +++ b/files/fr/web/events/index.html @@ -2,1975 +2,1013 @@ title: Référence des événements slug: Web/Events tags: - - NeedsTranslation + - Evénement + - Aperçu + - Référence translation_of: Web/Events --- -<p><span class="seoSummary">Les événements DOM sont notifiés au code source lorsque quelque chose d'intéressant se passe. Chaque événement est représenté par un objet implémentant l'interface {{domxref("Event")}}, et peut avoir d'autres propriétés et/ou champs, permettant d'obtenir des informations supplémentaires au sujet de ce qui s'est produit.</span> Les événements peuvent décrire de simples interactions avec l'utilisateur jusqu'à des notifications automatisées d'événements se produisant au niveau du modèle de rendu.</p> +<p>Les <a href="/fr/docs/Web/API/Document_Object_Model/Events">événements DOM</a> sont déclenchés pour notifier au code des « changements intéressants » qui peuvent affecter l'exécution du code. Ces changements peuvent résulter d'interactions avec l'utilisateur, comme l'utilisation de la souris ou le redimensionnement d'une fenêtre, de changements dans l'état de l'environnement sous-jacent (par exemple, une batterie faible ou des événements médiatiques provenant du système d'exploitation), et d'autres causes.</p> -<p>Cet article présente une liste d'événements pouvant être notifiés ; certains correspondent à des événements standards définis dans les spécifications officielles, tandis que d'autres sont des événements utilisés en interne par certains navigateurs ; par exemple, les événements propres à Mozilla sont listés pour que les <a href="/en-US/docs/Mozilla/Add-ons">add-ons</a> puissent interagir avec le navigateur.</p> +<p>Chaque événement est représenté par un objet implémentant l'interface {{domxref("Event")}}, et peut avoir d'autres propriétés et/ou champs, permettant d'obtenir des informations supplémentaires au sujet de ce qui s'est produit. La documentation de chaque événement comporte un tableau (en haut de la page) qui comprend un lien vers l'interface de l'événement associé et d'autres informations pertinentes. Une liste complète des différents types d'événements est donnée dans <a href="/fr/docs/Web/API/Event#introduction">Event > Interfaces basées sur Event</a>.</p> -<h2 id="Événements_standards">Événements standards</h2> +<p><span class="seoSummary">Cette rubrique fournit un index des principales <em>sortes</em> d'événements qui peuvent vous intéresser (animation, presse-papiers, workers, etc.) ainsi que les principales classes qui implémentent ces sortes d'événements. À la fin se trouve une liste exhaustive de tous les événements documentés.</span></p> -<p>Ces événements sont définis dans les spécifications officielles du web, et devraient donc être communs à tous les navigateurs. À chaque événement est associée l'interface implémentée par l'objet envoyé aux destinataires de l'événement (afin de pouvoir connaître les données fournies avec chaque événement), ainsi qu'un lien vers la ou les spécification(s) définissant l'événement.</p> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <th class="header" style="width: 220px;">Nom de l'événement</th> - <th class="header" style="width: 90px;">Type de l'événement</th> - <th class="header" style="width: 100px;">Spécification</th> - <th class="header">Déclenché lorsque...</th> - </tr> - <tr> - <td>{{event("abort")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-abort">DOM L3</a></td> - <td>Le chargement d'une ressource a été interrompu.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/abort_(ProgressEvent)">abort</a></code></td> - <td>{{domxref("ProgressEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/progress-events/">Progress</a> et <a href="http://www.w3.org/TR/XMLHttpRequest/#event-xhr-abort">XMLHttpRequest</a></td> - <td>La progression a été interrompue (pas dû à une erreur).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/abort_indexedDB">abort</a></code></td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/IndexedDB/#database-interface">IndexedDB</a></td> - <td>Une transaction a été interrompue.</td> - </tr> - <tr> - <td>{{event("afterprint")}}{{gecko_minversion_inline("6")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/html5/webappapis.html#printing">HTML5</a></td> - <td>Le document associé a commencé à être imprimé ou l'aperçu avant impression a été fermé.</td> - </tr> - <tr> - <td>{{event("animationend")}}</td> - <td>{{domxref("AnimationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/css3-animations/#animation-events">CSS Animations</a></td> - <td>Une <a href="/fr/docs/Web/CSS/Animations_CSS">animation CSS</a> s'est achevée.</td> - </tr> - <tr> - <td>{{event("animationiteration")}}</td> - <td>{{domxref("AnimationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/css3-animations/#animation-events">CSS Animations</a></td> - <td>Une <a href="/fr/docs/Web/CSS/Animations_CSS">animation CSS</a> est répétée.</td> - </tr> - <tr> - <td>{{event("animationstart")}}</td> - <td>{{domxref("AnimationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/css3-animations/#animation-events">CSS Animations</a></td> - <td>Une <a href="/fr/docs/Web/CSS/Animations_CSS">animation CSS</a> a débuté.</td> - </tr> - <tr> - <td>{{event("audioprocess")}}</td> - <td>{{domxref("AudioProcessingEvent")}}</td> - <td style="white-space: nowrap;">{{SpecName('Web Audio API', '#AudioProcessingEvent', 'audioprocess')}}</td> - <td>La mémoire tampon d'entrée d'un {{domxref("ScriptProcessorNode")}} est prête à être lue.</td> - </tr> - <tr> - <td>{{event("beforeprint")}} {{gecko_minversion_inline("6")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/html5/webappapis.html#printing">HTML5</a></td> - <td>Le document associé est sur le point d'être imprimé ou visualisé dans l'aperçu avant impression.</td> - </tr> - <tr> - <td>{{event("beforeunload")}}</td> - <td>{{domxref("BeforeUnloadEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/html5/browsers.html#unloading-documents">HTML5 </a></td> - <td></td> - </tr> - <tr> - <td>{{event("beginEvent")}}</td> - <td>{{domxref("TimeEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>Une animation <a href="/en-US/docs/SVG/SVG_animation_with_SMIL">SMIL</a> débute.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/blocked_indexedDB">blocked</a></code></td> - <td></td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/IndexedDB/#request-api">IndexedDB</a></td> - <td>Une connexion ouverte vers la base de données bloque une transaction <code>versionchange</code> (changement de version) sur la même base de données.</td> - </tr> - <tr> - <td>{{event("blur")}}</td> - <td>{{domxref("FocusEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-blur">DOM L3</a></td> - <td>Un élément perd le focus (ne se propage pas).</td> - </tr> - <tr> - <td>{{event("cached")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/html/wg/drafts/html/master/browsers.html#offline">Offline</a></td> - <td>Les ressources listées dans le manifeste ont été téléchargées, et l'application est désormais mise en cache.</td> - </tr> - <tr> - <td>{{event("canplay")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-canplay">HTML5 media</a></td> - <td>Le <em>user agent</em> peut lire le média, mais estime que trop peu de données ont été chargées pour lire le média jusqu'au bout sans avoir à s'arrêter pour mettre en mémoire tampon la suite du contenu.</td> - </tr> - <tr> - <td>{{event("canplaythrough")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-canplaythrough">HTML5 media</a></td> - <td>Le <em>user agent</em> peut lire le média, et estime que suffisamment de données ont été chargées pour lire le média jusqu'au bout sans avoir à s'arrêter pour mettre en mémoire tampon la suite du contenu.</td> - </tr> - <tr> - <td>{{event("change")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-2-Events/events.html">DOM L2</a>, <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/common-input-element-attributes.html#event-input-change">HTML5</a></td> - <td>Un élément perd le focus et sa valeur a changé depuis l'acquisition du focus.</td> - </tr> - <tr> - <td>{{event("chargingchange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="https://dvcs.w3.org/hg/dap/raw-file/tip/battery/Overview.html">Battery status</a></td> - <td>La batterie commence ou finit de charger.</td> - </tr> - <tr> - <td>{{event("chargingtimechange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="https://dvcs.w3.org/hg/dap/raw-file/tip/battery/Overview.html">Battery status</a></td> - <td>L'attribut <code>chargingTime</code> (temps de chargement) a été mis à jour.</td> - </tr> - <tr> - <td>{{event("checking")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/html/wg/drafts/html/master/browsers.html#offline">Offline</a></td> - <td>Le <em>user agent</em> vérifie l'existence d'une mise à jour, ou tente de télécharger le manifeste du cache pour la première fois.</td> - </tr> - <tr> - <td>{{event("click")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-click">DOM L3</a></td> - <td>Un bouton d'un dispositif de pointage a été appuyé ou relaché sur un élément.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/close_websocket">close</a></code></td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/websockets/">WebSocket</a></td> - <td>Une connexion WebSocket a été fermée.</td> - </tr> - <tr> - <td>{{event("compassneedscalibration")}}</td> - <td>{{domxref("SensorEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/orientation-event/#compassneedscalibration">Orientation</a></td> - <td>La boussole permettant d'obtenir les données d'orientation doit être calibrée.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/complete_indexedDB">complete</a></code></td> - <td></td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/IndexedDB/#transaction">IndexedDB</a></td> - <td></td> - </tr> - <tr> - <td>{{event("complete")}}</td> - <td>{{domxref("OfflineAudioCompletionEvent")}}</td> - <td style="white-space: nowrap;">{{SpecName('Web Audio API', '#OfflineAudioCompletionEvent-section', 'OfflineAudioCompletionEvent')}}</td> - <td>Le rendu d'un {{domxref("OfflineAudioContext")}} est terminé.</td> - </tr> - <tr> - <td>{{event("compositionend")}}{{gecko_minversion_inline("9")}}</td> - <td>{{domxref("CompositionEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-compositionend">DOM L3</a></td> - <td>La composition d'un passage de texte a été achevée ou annulée.</td> - </tr> - <tr> - <td>{{event("compositionstart")}}{{gecko_minversion_inline("9")}}</td> - <td>{{domxref("CompositionEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-compositionstart">DOM L3</a></td> - <td>La composition d'un passage de texte est prête (équivalent à l'événement <code>keydown</code> pour un clavier, mais fonctionne avec d'autres entrées comme la reconnaissance vocale).</td> - </tr> - <tr> - <td>{{event("compositionupdate")}}{{gecko_minversion_inline("9")}}</td> - <td>{{domxref("CompositionEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-compositionupdate">DOM L3</a></td> - <td>Un caractère est ajouté à un passage de texte en cours de composition.</td> - </tr> - <tr> - <td>{{event("contextmenu")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/html5/interactive-elements.html#context-menus">HTML5</a></td> - <td>Le bouton droit de la souris est cliqué (avant l'affichage du menu contextuel).</td> - </tr> - <tr> - <td>{{event("copy")}}</td> - <td>{{domxref("ClipboardEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/clipboard-apis/#copy-event">Clipboard</a></td> - <td>La sélection de texte a été ajoutée au presse-papiers.</td> - </tr> - <tr> - <td>{{event("cut")}}</td> - <td>{{domxref("ClipboardEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/clipboard-apis/#cut-event">Clipboard</a></td> - <td>La sélection de texte a été enlevée du document et ajoutée au presse-papiers.</td> - </tr> - <tr> - <td>{{event("dblclick")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-dblclick">DOM L3</a></td> - <td>Un bouton d'un dispositif de pointage a été double-cliqué sur un élément.</td> - </tr> - <tr> - <td>{{event("devicelight")}}</td> - <td>{{domxref("DeviceLightEvent")}}</td> - <td style="white-space: nowrap;"><a class="external" href="http://dvcs.w3.org/hg/dap/raw-file/tip/light/Overview.html" lang="en" title="The definition of 'Ambient Light Events' in that specification.">Ambient Light Events</a></td> - <td>Le capteur de lumière a de nouvelles données disponibles.</td> - </tr> - <tr> - <td>{{event("devicemotion")}}</td> - <td>{{domxref("DeviceMotionEvent")}}</td> - <td style="white-space: nowrap;"><a class="external" href="http://dev.w3.org/geo/api/spec-source-orientation.html" lang="en" title="The 'Device Orientation Events' specification">Device Orientation Events</a></td> - <td>Le capteur de mouvement a de nouvelles données disponibles.</td> - </tr> - <tr> - <td>{{event("deviceorientation")}}</td> - <td>{{domxref("DeviceOrientationEvent")}}</td> - <td style="white-space: nowrap;"><a class="external" href="http://dev.w3.org/geo/api/spec-source-orientation.html" lang="en" title="The 'Device Orientation Events' specification">Device Orientation Events</a></td> - <td>Le capteur d'orientation a de nouvelles données disponibles.</td> - </tr> - <tr> - <td>{{event("deviceproximity")}}</td> - <td>{{domxref("DeviceProximityEvent")}}</td> - <td style="white-space: nowrap;"><a class="external" href="http://dvcs.w3.org/hg/dap/raw-file/tip/proximity/Overview.html" lang="en" title="The definition of 'Proximity Events' in that specification.">Proximity Events</a></td> - <td>Le capteur de proximité a de nouvelles données disponibles (indique une distance approximative entre l'appareil et un object avoisinant).</td> - </tr> - <tr> - <td>{{event("dischargingtimechange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="https://dvcs.w3.org/hg/dap/raw-file/tip/battery/Overview.html">Battery status</a></td> - <td>L'attribut <code>dischargingTime</code> (temps de décharge) a été mis à jour.</td> - </tr> - <tr> - <td><code>DOMActivate</code> {{deprecated_inline}}</td> - <td>{{domxref("UIEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMActivate">DOM L3</a></td> - <td>Un bouton, un lien ou un élément à changement d'état est activé (utiliser plutôt {{event("click")}}).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/DOM/Mutation_events">DOMAttributeNameChanged</a></code> {{deprecated_inline}}</td> - <td>{{domxref("MutationNameEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/2011/WD-DOM-Level-3-Events-20110531/#event-type-DOMAttributeNameChanged">DOM L3</a> Removed</td> - <td>Le nom d'un attribut a changé (utiliser plutôt les <a href="/en-US/docs/DOM/MutationObserver">observateurs de mutation</a>).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/DOM/Mutation_events">DOMAttrModified</a></code> {{deprecated_inline}}</td> - <td>{{domxref("MutationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMAttrModified">DOM L3</a></td> - <td>La valeur d'un attribut a été modifiée (utiliser plutôt les <a href="/en-US/docs/DOM/MutationObserver">observateurs de mutation</a>).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/DOM/Mutation_events">DOMCharacterDataModified</a></code> {{deprecated_inline}}</td> - <td>{{domxref("MutationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMCharacterDataModified">DOM L3</a></td> - <td>Un texte - ou autres <a href="/en-US/docs/DOM/CharacterData">Données caractère</a> - a été changé (utiliser plutôt les <a href="/en-US/docs/DOM/MutationObserver">observateurs de mutation</a>).</td> - </tr> - <tr> - <td>{{event("DOMContentLoaded")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-end.html#the-end">HTML5</a></td> - <td>Le document a fini de charger (mais pas les ressources qui en dépendent).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/DOM/Mutation_events">DOMElementNameChanged</a></code> {{deprecated_inline}}</td> - <td>{{domxref("MutationNameEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/2011/WD-DOM-Level-3-Events-20110531/#event-type-DOMElementNameChanged">DOM L3</a> Removed</td> - <td>Le nom d'un élément a changé (utiliser plutôt les <a href="/en-US/docs/DOM/MutationObserver">observateurs de mutation</a>).</td> - </tr> - <tr> - <td><code>DOMFocusIn</code> {{deprecated_inline}}</td> - <td>{{domxref("FocusEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMFocusIn">DOM L3</a></td> - <td>Un élément a acquis le focus (utiliser plutôt {{event("focus")}} ou {{event("focusin")}}).</td> - </tr> - <tr> - <td><code>DOMFocusOut</code> {{deprecated_inline}}</td> - <td>{{domxref("FocusEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMFocusOut">DOM L3</a></td> - <td>Un élément a perdu le focus (utiliser plutôt {{event("blur")}} ou {{event("focusout")}}).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/DOM/Mutation_events">DOMNodeInserted</a></code> {{deprecated_inline}}</td> - <td>{{domxref("MutationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMNodeInserted">DOM L3</a></td> - <td>Un nœud a été ajouté comme enfant d'un autre nœud (utiliser plutôt les <a href="/en-US/docs/DOM/MutationObserver" style="text-decoration: underline;">observateurs de mutation</a>).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/DOM/Mutation_events">DOMNodeInsertedIntoDocument</a></code> {{deprecated_inline}}</td> - <td>{{domxref("MutationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMNodeInsertedIntoDocument">DOM L3</a></td> - <td>Un nœud a été ajouté au document (utiliser plutôt les <a href="/en-US/docs/DOM/MutationObserver" style="text-decoration: underline;">observateurs de mutation</a>).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/DOM/Mutation_events">DOMNodeRemoved</a></code> {{deprecated_inline}}</td> - <td>{{domxref("MutationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMNodeRemoved">DOM L3</a></td> - <td>Un nœud a été retiré de son nœud parent (utiliser plutôt les <a href="/en-US/docs/DOM/MutationObserver" style="text-decoration: underline;">observateurs de mutation</a>).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/DOM/Mutation_events">DOMNodeRemovedFromDocument</a></code> {{deprecated_inline}}</td> - <td>{{domxref("MutationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMNodeRemovedFromDocument">DOM L3</a></td> - <td>Un nœud a été retiré du document (utiliser plutôt les <a href="/en-US/docs/DOM/MutationObserver" style="text-decoration: underline;">observateurs de mutation</a>).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/DOM/Mutation_events">DOMSubtreeModified</a></code> {{deprecated_inline}}</td> - <td>{{domxref("MutationEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMSubtreeModified">DOM L3</a></td> - <td>Un changement a eu lieu dans le document (utiliser plutôt les <a href="/en-US/docs/DOM/MutationObserver" style="text-decoration: underline;">observateurs de mutation</a>).</td> - </tr> - <tr> - <td>{{event("downloading")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/html/wg/drafts/html/master/browsers.html#offline">Offline</a></td> - <td>Le <em>user agent</em> a trouvé une mise à jour et la récupère, ou il télécharge les ressources listées dans le manifeste du cache pour la première fois.</td> - </tr> - <tr> - <td>{{event("drag")}}</td> - <td>{{domxref("DragEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html#event-drag">HTML5</a></td> - <td>Un élément ou la sélection de texte est glissé (toutes les 350ms).</td> - </tr> - <tr> - <td>{{event("dragend")}}</td> - <td>{{domxref("DragEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html#event-dragend">HTML5</a></td> - <td>Un glisser-déposer a été achevé (en relâchant le bouton de la souris ou en appuyant sur la touche Echap).</td> - </tr> - <tr> - <td>{{event("dragenter")}}</td> - <td>{{domxref("DragEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html#event-dragenter">HTML5</a></td> - <td>Un élément ou une sélection de texte en cours de glisser-déposer entre dans une zone valide de dépôt.</td> - </tr> - <tr> - <td>{{event("dragleave")}}</td> - <td>{{domxref("DragEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html#event-dragleave">HTML5</a></td> - <td>Un élément ou une sélection de texte en cours de glisser-déposer quitte une zone valide de dépôt.</td> - </tr> - <tr> - <td>{{event("dragover")}}</td> - <td>{{domxref("DragEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html#event-dragover">HTML5</a></td> - <td>Un élément ou une sélection de texte en cours de glisser-déposer survole une zone valide de dépôt (toutes les 350ms).</td> - </tr> - <tr> - <td>{{event("dragstart")}}</td> - <td>{{domxref("DragEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html#event-dragstart">HTML5</a></td> - <td>L'utilisateur commence à glisser un élément ou une sélection de texte.</td> - </tr> - <tr> - <td>{{event("drop")}}</td> - <td>{{domxref("DragEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html#event-drop">HTML5</a></td> - <td>Un élément est déposé sur une zone valide de dépôt.</td> - </tr> - <tr> - <td>{{event("durationchange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-durationchange">HTML5 media</a></td> - <td>L'attribut <code>duration</code> (durée) a été mis à jour.</td> - </tr> - <tr> - <td>{{event("emptied")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-emptied">HTML5 media</a></td> - <td>Le média a été vidé ; par exemple, cet événement est déclenché si un média a déjà été chargé (au moins partiellement) et que la méthode <a href="/en-US/docs/XPCOM_Interface_Reference/NsIDOMHTMLMediaElement" rel="internal"><code>load()</code></a> (charger) est appelée pour le recharger.</td> - </tr> - <tr> - <td>{{event("ended")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-ended">HTML5 media</a></td> - <td>La lecture a été interrompue car la fin du média a été atteinte.</td> - </tr> - <tr> - <td>{{event("ended_(Web_Audio)", "ended")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;">{{SpecName("Web Audio API")}}</td> - <td></td> - </tr> - <tr> - <td>{{event("endEvent")}}</td> - <td>{{domxref("TimeEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>Une animation <a href="/en-US/docs/SVG/SVG_animation_with_SMIL">SMIL</a> est terminé.</td> - </tr> - <tr> - <td>{{event("error")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-error">DOM L3</a></td> - <td>Le chargement d'une ressource a échoué.</td> - </tr> - <tr> - <td>{{event("error")}}</td> - <td>{{domxref("ProgressEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/progress-events/">Progress</a><span> et </span><a href="http://www.w3.org/TR/XMLHttpRequest/#event-xhr-error">XMLHttpRequest</a></td> - <td>La progression a échoué.</td> - </tr> - <tr> - <td>{{event("error")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/html/wg/drafts/html/master/browsers.html#offline">Offline</a></td> - <td>Une erreur a eu lieu lors du téléchargement du manifeste de cache ou lors de la mise à jour du contenu de l'application.</td> - </tr> - <tr> - <td>{{event("error")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/websockets/">WebSocket</a></td> - <td>Une connexion WebSocket a été fermée avec préjudice (par exemple, des données n'ont pas pu être envoyées).</td> - </tr> - <tr> - <td>{{event("error")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://dev.w3.org/html5/eventsource/">Server Sent Events</a></td> - <td>Une connexion de la source d'événement a échoué.</td> - </tr> - <tr> - <td>{{event("error")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/IndexedDB/#request-api">IndexedDB</a></td> - <td>Une requête a causé une erreur et a échoué.</td> - </tr> - <tr> - <td>{{event("focus")}}</td> - <td>{{domxref("FocusEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-focus">DOM L3</a></td> - <td>Un élément a acquis le focus (ne se propage pas).</td> - </tr> - <tr> - <td>{{event("focusin")}}</td> - <td>{{domxref("FocusEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-focusIn">DOM L3</a></td> - <td>Un élément est sur le point d'acquérir le focus (se propage).</td> - </tr> - <tr> - <td>{{event("focusout")}}</td> - <td>{{domxref("FocusEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-focusout">DOM L3</a></td> - <td>Un élément est sur le point de perdre le focus (se propage).</td> - </tr> - <tr> - <td>{{event("fullscreenchange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="https://dvcs.w3.org/hg/fullscreen/raw-file/tip/Overview.html#api">Full Screen</a></td> - <td>Un élément est passé en mode plein écran, ou est revenu au mode normal.</td> - </tr> - <tr> - <td>{{event("fullscreenerror")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="https://dvcs.w3.org/hg/fullscreen/raw-file/tip/Overview.html#api">Full Screen</a></td> - <td>Il est impossible de passer en mode plein écran pour des raisons techniques ou parce que la permission a été refusée.</td> - </tr> - <tr> - <td>{{event("gamepadconnected")}}</td> - <td>{{domxref("GamepadEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/gamepad/#the-gamepadconnected-event">Gamepad</a></td> - <td>Une manette de jeu a été connectée.</td> - </tr> - <tr> - <td>{{event("gamepaddisconnected")}}</td> - <td>{{domxref("GamepadEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/gamepad/#the-gamepaddisconnected-event">Gamepad</a></td> - <td>Une manette de jeu a été déconnectée.</td> - </tr> - <tr> - <td>{{event("hashchange")}}</td> - <td>{{domxref("HashChangeEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#event-hashchange">HTML5</a></td> - <td>L'identifiicateur de fragment de l'URL a été changé (la partie de l'URL après le #).</td> - </tr> - <tr> - <td>{{event("input")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/html5/forms.html#common-event-behaviors">HTML5</a></td> - <td>La valeur d'un élément change ou le contenu d'un élément avec l'attribut <a href="/en-US/docs/DOM/Element.contentEditable">contenteditable</a> est modifié.</td> - </tr> - <tr> - <td>{{event("invalid")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#constraint-validation">HTML5</a></td> - <td>Un élément à soumettre a été vérifié et ne satisfait pas ses contraintes.</td> - </tr> - <tr> - <td>{{event("keydown")}}</td> - <td>{{domxref("KeyboardEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-keydown">DOM L3</a></td> - <td>Une touche est enfoncée.</td> - </tr> - <tr> - <td>{{event("keypress")}}</td> - <td>{{domxref("KeyboardEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-keypress">DOM L3</a></td> - <td>Une touche est pressée et cette touche produit normalement un caractère (utilisez input à la place).</td> - </tr> - <tr> - <td>{{event("keyup")}}</td> - <td>{{domxref("KeyboardEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-keyup">DOM L3</a></td> - <td>Une touche est relâchée.</td> - </tr> - <tr> - <td>{{event("languagechange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;">{{ SpecName('HTML5.1', '#dom-navigator-languages', 'NavigatorLanguage.languages') }}</td> - <td></td> - </tr> - <tr> - <td>{{event("levelchange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="https://dvcs.w3.org/hg/dap/raw-file/tip/battery/Overview.html">Battery status</a></td> - <td>L'attribut <code>level</code> a été mis à jour.</td> - </tr> - <tr> - <td>{{event("load")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-load">DOM L3</a></td> - <td>Une ressource et ses ressources dépendantes ont fini de se charger.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/load_(ProgressEvent)">load</a></code></td> - <td>{{domxref("ProgressEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/progress-events/">Progress</a><span> <span>et </span></span><a href="http://www.w3.org/TR/XMLHttpRequest/#event-xhr-load">XMLHttpRequest</a></td> - <td>La progression est réussie.</td> - </tr> - <tr> - <td>{{event("loadeddata")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-loadeddata">HTML5 media</a></td> - <td>Le premier cadre du média a fini de se charger.</td> - </tr> - <tr> - <td>{{event("loadedmetadata")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-loadedmetadata">HTML5 media</a></td> - <td>Les metadata ont été chargées.</td> - </tr> - <tr> - <td>{{event("loadend")}}</td> - <td>{{domxref("ProgressEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/progress-events/">Progress</a><span> <span>et </span></span><a href="http://www.w3.org/TR/XMLHttpRequest/#event-xhr-loadend">XMLHttpRequest</a></td> - <td>Progress has stopped (after "error", "abort" or "load" have been dispatched).</td> - </tr> - <tr> - <td>{{event("loadstart")}}</td> - <td>{{domxref("ProgressEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/progress-events/">Progress </a><span>et </span><a href="http://www.w3.org/TR/XMLHttpRequest/#event-xhr-loadstart">XMLHttpRequest</a></td> - <td>Progress has begun.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/message_websocket">message</a></code></td> - <td>{{domxref("MessageEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/websockets/">WebSocket</a></td> - <td>A message is received through a WebSocket.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/message_webworker">message</a></code></td> - <td>{{domxref("MessageEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/workers/#communicating-with-a-dedicated-worker">Web Workers</a></td> - <td>A message is received from a Web Worker.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/message_webmessaging">message</a></code></td> - <td>{{domxref("MessageEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/webmessaging/">Web Messaging</a></td> - <td>A message is received from a child (i)frame or a parent window.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/message_serversentevents">message</a></code></td> - <td>{{domxref("MessageEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://dev.w3.org/html5/eventsource/">Server Sent Events</a></td> - <td>A message is received through an event source.</td> - </tr> - <tr> - <td>{{event("mousedown")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mousedown">DOM L3</a></td> - <td>A pointing device button (usually a mouse) is pressed on an element.</td> - </tr> - <tr> - <td>{{event("mouseenter")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mouseenter">DOM L3</a></td> - <td>A pointing device is moved onto the element that has the listener attached.</td> - </tr> - <tr> - <td>{{event("mouseleave")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mouseleave">DOM L3</a></td> - <td>A pointing device is moved off the element that has the listener attached.</td> - </tr> - <tr> - <td>{{event("mousemove")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mousemove">DOM L3</a></td> - <td>A pointing device is moved over an element.</td> - </tr> - <tr> - <td>{{event("mouseout")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mouseout">DOM L3</a></td> - <td>A pointing device is moved off the element that has the listener attached or off one of its children.</td> - </tr> - <tr> - <td>{{event("mouseover")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mouseover">DOM L3</a></td> - <td>A pointing device is moved onto the element that has the listener attached or onto one of its children.</td> - </tr> - <tr> - <td>{{event("mouseup")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mouseup">DOM L3</a></td> - <td>A pointing device button is released over an element.</td> - </tr> - <tr> - <td>{{event("noupdate")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/html/wg/drafts/html/master/browsers.html#offline">Offline</a></td> - <td>The manifest hadn't changed.</td> - </tr> - <tr> - <td>{{event("obsolete")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/html/wg/drafts/html/master/browsers.html#offline">Offline</a></td> - <td>The manifest was found to have become a 404 or 410 page, so the application cache is being deleted.</td> - </tr> - <tr> - <td>{{event("offline")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html#event-offline">HTML5 offline</a></td> - <td>The browser has lost access to the network.</td> - </tr> - <tr> - <td>{{event("online")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html#event-online">HTML5 offline</a></td> - <td>The browser has gained access to the network (but particular websites might be unreachable).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/open_websocket">open</a></code></td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/websockets/">WebSocket</a></td> - <td>A WebSocket connection has been established.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/open_serversentevents">open</a></code></td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://dev.w3.org/html5/eventsource/">Server Sent Events</a></td> - <td>An event source connection has been established.</td> - </tr> - <tr> - <td>{{event("orientationchange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/screen-orientation/">Screen Orientation</a></td> - <td>The orientation of the device (portrait/landscape) has changed</td> - </tr> - <tr> - <td>{{event("pagehide")}}</td> - <td>{{domxref("PageTransitionEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#event-pagehide">HTML5</a></td> - <td>A session history entry is being traversed from.</td> - </tr> - <tr> - <td>{{event("pageshow")}}</td> - <td>{{domxref("PageTransitionEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#event-pageshow">HTML5</a></td> - <td>A session history entry is being traversed to.</td> - </tr> - <tr> - <td>{{event("paste")}}</td> - <td>{{domxref("ClipboardEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/clipboard-apis/#paste-event">Clipboard</a></td> - <td>Data has been transfered from the system clipboard to the document.</td> - </tr> - <tr> - <td>{{event("pause")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-pause">HTML5 media</a></td> - <td>Playback has been paused.</td> - </tr> - <tr> - <td>{{event("pointerlockchange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/pointerlock/#pointerlockchange-and-pointerlockerror-events">Pointer Lock</a></td> - <td>The pointer was locked or released.</td> - </tr> - <tr> - <td>{{event("pointerlockerror")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/pointerlock/#pointerlockchange-and-pointerlockerror-events">Pointer Lock</a></td> - <td>It was impossible to lock the pointer for technical reasons or because the permission was denied.</td> - </tr> - <tr> - <td>{{event("play")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-play">HTML5 media</a></td> - <td>Playback has begun.</td> - </tr> - <tr> - <td>{{event("playing")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-playing">HTML5 media</a></td> - <td>Playback is ready to start after having been paused or delayed due to lack of data.</td> - </tr> - <tr> - <td>{{event("popstate")}}</td> - <td>{{domxref("PopStateEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#event-popstate">HTML5</a></td> - <td>A session history entry is being navigated to (in certain cases).</td> - </tr> - <tr> - <td>{{event("progress")}}</td> - <td>{{domxref("ProgressEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/progress-events/">Progress</a><span> <span>and </span></span><a href="http://www.w3.org/TR/XMLHttpRequest/#event-xhr-progress">XMLHttpRequest</a></td> - <td>In progress.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/progress_(appcache_event)">progress</a></code></td> - <td>{{domxref("ProgressEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/html/wg/drafts/html/master/browsers.html#offline">Offline</a></td> - <td>The user agent is downloading resources listed by the manifest.</td> - </tr> - <tr> - <td>{{event("ratechange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-ratechange">HTML5 media</a></td> - <td>The playback rate has changed.</td> - </tr> - <tr> - <td>{{event("readystatechange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><span>HTML5 <span>et </span></span><a href="http://www.w3.org/TR/XMLHttpRequest/#event-xhr-readystatechange">XMLHttpRequest</a></td> - <td>The readyState attribute of a document has changed.</td> - </tr> - <tr> - <td>{{event("repeatEvent")}}</td> - <td>{{domxref("TimeEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>A <a href="/en-US/docs/SVG/SVG_animation_with_SMIL">SMIL</a> animation element is repeated.</td> - </tr> - <tr> - <td>{{event("reset")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-2-Events/events.html">DOM L2</a>, <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#form-submission-0#resetting-a-form">HTML5</a></td> - <td>A form is reset.</td> - </tr> - <tr> - <td>{{event("resize")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-resize">DOM L3</a></td> - <td>The document view has been resized.</td> - </tr> - <tr> - <td>{{event("scroll")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-scroll">DOM L3</a></td> - <td>The document view or an element has been scrolled.</td> - </tr> - <tr> - <td>{{event("seeked")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-seeked">HTML5 media</a></td> - <td>A <em>seek</em> operation completed.</td> - </tr> - <tr> - <td>{{event("seeking")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-seeking">HTML5 media</a></td> - <td>A <em>seek</em> operation began.</td> - </tr> - <tr> - <td>{{event("select")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-select">DOM L3</a></td> - <td>Some text is being selected.</td> - </tr> - <tr> - <td>{{event("show")}}</td> - <td>{{domxref("MouseEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/html5/interactive-elements.html#context-menus">HTML5</a></td> - <td>A contextmenu event was fired on/bubbled to an element that has a <a href="/en-US/docs/DOM/element.contextmenu">contextmenu</a> attribute</td> - </tr> - <tr> - <td>{{event("stalled")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-stalled">HTML5 media</a></td> - <td>The user agent is trying to fetch media data, but data is unexpectedly not forthcoming.</td> - </tr> - <tr> - <td>{{event("storage")}}</td> - <td>{{domxref("StorageEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/webstorage/#the-storage-event">Web Storage</a></td> - <td>A storage area (<a href="/en-US/docs/DOM/Storage#localStorage">localStorage</a> or <a href="/en-US/docs/DOM/Storage#sessionStorage">sessionStorage</a>) has changed.</td> - </tr> - <tr> - <td>{{event("submit")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-2-Events/events.html">DOM L2</a>, <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#form-submission-algorithm">HTML5</a></td> - <td>A form is submitted.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/success_indexedDB">success</a></code></td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/IndexedDB/#request-api">IndexedDB</a></td> - <td>A request successfully completed.</td> - </tr> - <tr> - <td>{{event("suspend")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-suspend">HTML5 media</a></td> - <td>Media data loading has been suspended.</td> - </tr> - <tr> - <td>{{event("SVGAbort")}}</td> - <td>{{domxref("SVGEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>Page loading has been stopped before the <a href="/en-US/docs/SVG">SVG</a> was loaded.</td> - </tr> - <tr> - <td>{{event("SVGError")}}</td> - <td>{{domxref("SVGEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>An error has occurred before the <a href="/en-US/docs/SVG">SVG</a> was loaded.</td> - </tr> - <tr> - <td>{{event("SVGLoad")}}</td> - <td>{{domxref("SVGEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>An <a href="/en-US/docs/SVG">SVG</a> document has been loaded and parsed.</td> - </tr> - <tr> - <td>{{event("SVGResize")}}</td> - <td>{{domxref("SVGEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>An <a href="/en-US/docs/SVG">SVG</a> document is being resized.</td> - </tr> - <tr> - <td>{{event("SVGScroll")}}</td> - <td>{{domxref("SVGEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>An <a href="/en-US/docs/SVG">SVG</a> document is being scrolled.</td> - </tr> - <tr> - <td>{{event("SVGUnload")}}</td> - <td>{{domxref("SVGEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>An <a href="/en-US/docs/SVG">SVG</a> document has been removed from a window or frame.</td> - </tr> - <tr> - <td>{{event("SVGZoom")}}</td> - <td>{{domxref("SVGZoomEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/SVG/interact.html#SVGEvents">SVG</a></td> - <td>An <a href="/en-US/docs/SVG">SVG</a> document is being zoomed.</td> - </tr> - <tr> - <td>{{event("timeout")}}</td> - <td>{{domxref("ProgressEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/XMLHttpRequest/#event-xhr-timeout">XMLHttpRequest</a></td> - <td></td> - </tr> - <tr> - <td>{{event("timeupdate")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-timeupdate">HTML5 media</a></td> - <td>The time indicated by the <code>currentTime</code> attribute has been updated.</td> - </tr> - <tr> - <td>{{event("touchcancel")}}</td> - <td>{{domxref("TouchEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/touch-events/">Touch Events</a></td> - <td>A touch point has been disrupted in an implementation-specific manners (too many touch points for example).</td> - </tr> - <tr> - <td>{{event("touchend")}}</td> - <td>{{domxref("TouchEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/touch-events/#the-touchend-event">Touch Events</a></td> - <td>A touch point is removed from the touch surface.</td> - </tr> - <tr> - <td>{{event("touchenter")}}</td> - <td>{{domxref("TouchEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/touch-events/">Touch Events</a> Removed</td> - <td>A touch point is moved onto the interactive area of an element.</td> - </tr> - <tr> - <td>{{event("touchleave")}}</td> - <td>{{domxref("TouchEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/touch-events/">Touch Events</a> Removed</td> - <td>A touch point is moved off the interactive area of an element.</td> - </tr> - <tr> - <td>{{event("touchmove")}}</td> - <td>{{domxref("TouchEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/touch-events/#the-touchmove-event">Touch Events</a></td> - <td>A touch point is moved along the touch surface.</td> - </tr> - <tr> - <td>{{event("touchstart")}}</td> - <td>{{domxref("TouchEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/touch-events/#the-touchstart---------event">Touch Events</a></td> - <td>A touch point is placed on the touch surface.</td> - </tr> - <tr> - <td>{{event("transitionend")}}</td> - <td>{{domxref("TransitionEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/css3-transitions/#transition-events">CSS Transitions</a></td> - <td>A <a href="/en-US/docs/CSS/CSS_transitions">CSS transition</a> has completed.</td> - </tr> - <tr> - <td>{{event("unload")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-unload">DOM L3</a></td> - <td>The document or a dependent resource is being unloaded.</td> - </tr> - <tr> - <td>{{event("updateready")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://dev.w3.org/html5/spec/offline.html">Offline</a></td> - <td>The resources listed in the manifest have been newly redownloaded, and the script can use <code>swapCache()</code> to switch to the new cache.</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/upgradeneeded_indexedDB">upgradeneeded</a></code></td> - <td></td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/IndexedDB/#request-api">IndexedDB</a></td> - <td>An attempt was made to open a database with a version number higher than its current version. A <code>versionchange</code> transaction has been created.</td> - </tr> - <tr> - <td>{{event("userproximity")}}</td> - <td>{{domxref("SensorEvent")}}</td> - <td style="white-space: nowrap;"><a href="https://dvcs.w3.org/hg/dap/raw-file/tip/proximity/Overview.html">Sensor</a></td> - <td>Fresh data is available from a proximity sensor (indicates whether the nearby object is <code>near</code> the device or not).</td> - </tr> - <tr> - <td><code><a href="/en-US/docs/Web/Reference/Events/versionchange_indexedDB">versionchange</a></code></td> - <td></td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/IndexedDB/#database-interface">IndexedDB</a></td> - <td>A <code>versionchange</code> transaction completed.</td> - </tr> - <tr> - <td>{{event("visibilitychange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/page-visibility/#sec-visibilitychange-event">Page visibility</a></td> - <td>The content of a tab has become visible or has been hidden.</td> - </tr> - <tr> - <td>{{event("volumechange")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-volumechange">HTML5 media</a></td> - <td>The volume has changed.</td> - </tr> - <tr> - <td>{{event("waiting")}}</td> - <td>{{domxref("Event")}}</td> - <td style="white-space: nowrap;"><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-media-waiting">HTML5 media</a></td> - <td>Playback has stopped because of a temporary lack of data.</td> - </tr> - <tr> - <td>{{event("wheel")}}{{gecko_minversion_inline("17")}}</td> - <td>{{domxref("WheelEvent")}}</td> - <td style="white-space: nowrap;"><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-wheel">DOM L3</a></td> - <td>A wheel button of a pointing device is rotated in any direction.</td> - </tr> - </tbody> -</table> - -<h2 id="Non-standard_events">Non-standard events</h2> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <th class="header" style="width: 220px;">Event Name</th> - <th class="header" style="width: 90px;">Event Type</th> - <th class="header" style="width: 100px;">Specification</th> - <th class="header">Fired when...</th> - </tr> - <tr> - <td>{{event("afterscriptexecute")}}</td> - <td>{{domxref("Event")}}</td> - <td><em>Mozilla Specific</em></td> - <td>A script has been executed.</td> - </tr> - <tr> - <td>{{event("beforescriptexecute")}}</td> - <td>{{domxref("Event")}}</td> - <td><em>Mozilla Specific</em></td> - <td>A script is about to be executed.</td> - </tr> - <tr> - <td>{{event("cardstatechange")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>The {{domxref("MozMobileConnection.cardState")}} property changes value.</td> - </tr> - <tr> - <td>{{event("change")}}</td> - <td>{{domxref("DeviceStorageChangeEvent")}}</td> - <td><em>Firefox OS specific</em></td> - <td>This event is triggered each time a file is created, modified or deleted on a given storage area.</td> - </tr> - <tr> - <td>{{event("connectionInfoUpdate")}}</td> - <td></td> - <td><a href="http://mxr.mozilla.org/mozilla-central/source/dom/wifi/nsIWifi.idl?rev=3e586802f478#176"><em>Firefox OS specific</em></a></td> - <td>The informations about the signal strength and the link speed have been updated.</td> - </tr> - <tr> - <td>{{event("cfstatechange")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>The call forwarding state changes.</td> - </tr> - <tr> - <td>{{event("datachange")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>The {{domxref("MozMobileConnection.data")}} object changes values.</td> - </tr> - <tr> - <td>{{event("dataerror")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>The {{domxref("MozMobileConnection.data")}} object receive an error from the <abbr title="Radio Interface Layer">RIL</abbr>.</td> - </tr> - <tr> - <td>{{event("DOMMouseScroll")}}{{deprecated_inline}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>The wheel button of a pointing device is rotated (detail attribute is a number of lines). (use {{event("wheel")}} instead)</td> - </tr> - <tr> - <td><code>dragdrop</code> {{deprecated_inline}}</td> - <td><code>DragEvent</code></td> - <td><em>Mozilla specific</em></td> - <td>An element is dropped (use {{event("drop")}} instead).</td> - </tr> - <tr> - <td><code>dragexit</code> {{deprecated_inline}}</td> - <td><code>DragEvent</code></td> - <td><em>Mozilla specific</em></td> - <td>A drag operation is being ended(use {{event("dragend")}} instead).</td> - </tr> - <tr> - <td><code>draggesture</code> {{deprecated_inline}}</td> - <td><code>DragEvent</code></td> - <td><em>Mozilla specific</em></td> - <td>The user starts dragging an element or text selection (use {{event("dragstart")}} instead).</td> - </tr> - <tr> - <td>{{event("icccardlockerror")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>the {{domxref("MozMobileConnection.unlockCardLock()")}} or {{domxref("MozMobileConnection.setCardLock()")}} methods fails.</td> - </tr> - <tr> - <td>{{event("iccinfochange")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>The {{domxref("MozMobileConnection.iccInfo")}} object changes.</td> - </tr> - <tr> - <td>{{event("localized")}}</td> - <td></td> - <td><em><a href="https://github.com/fabi1cazenave/webL10n">Mozilla Specific</a></em></td> - <td>The page has been localized using data-l10n-* attributes.</td> - </tr> - <tr> - <td>{{event("mousewheel")}}{{deprecated_inline}}</td> - <td></td> - <td><a href="http://msdn.microsoft.com/en-us/library/ie/ms536951%28v=vs.85%29.aspx"><em>IE invented</em></a></td> - <td>The wheel button of a pointing device is rotated.</td> - </tr> - <tr> - <td>{{event("MozAudioAvailable")}}</td> - <td>{{domxref("Event")}}</td> - <td><em>Mozilla specific</em></td> - <td>The audio buffer is full and the corresponding raw samples are available.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozBeforeResize"><code>MozBeforeResize</code></a> {{obsolete_inline}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>A window is about to be resized.</td> - </tr> - <tr> - <td>{{event("mozbrowserclose")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when window.close() is called within a browser iframe.</td> - </tr> - <tr> - <td>{{event("mozbrowsercontextmenu")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when a browser {{HTMLElement("iframe")}} try to open a context menu.</td> - </tr> - <tr> - <td>{{event("mozbrowsererror")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when an error occured while trying to load a content within a browser iframe</td> - </tr> - <tr> - <td>{{event("mozbrowsericonchange")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when the favicon of a browser iframe changes.</td> - </tr> - <tr> - <td>{{event("mozbrowserlocationchange")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when an browser iframe's location changes.</td> - </tr> - <tr> - <td>{{event("mozbrowserloadend")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when the browser iframe has finished loading all its assets.</td> - </tr> - <tr> - <td>{{event("mozbrowserloadstart")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when the browser iframe starts to load a new page.</td> - </tr> - <tr> - <td>{{event("mozbrowseropenwindow")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when {{domxref("window.open()")}} is called within a browser iframe.</td> - </tr> - <tr> - <td>{{event("mozbrowsersecuritychange")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when the SSL state changes within a browser iframe.</td> - </tr> - <tr> - <td>{{event("mozbrowsershowmodalprompt")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when {{domxref("window.alert","alert()")}}, {{domxref("window.confirm","confirm()")}} or {{domxref("window.prompt","prompt()")}} are called within a browser iframe</td> - </tr> - <tr> - <td>{{event("mozbrowsertitlechange")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>Sent when the document.title changes within a browser iframe.</td> - </tr> - <tr> - <td>{{event("MozGamepadButtonDown")}}</td> - <td></td> - <td><em>To be specified</em></td> - <td>A gamepad button is pressed down.</td> - </tr> - <tr> - <td>{{event("MozGamepadButtonUp")}}</td> - <td></td> - <td><em>To be specified</em></td> - <td>A gamepad button is released.</td> - </tr> - <tr> - <td>{{event("MozMousePixelScroll")}} {{deprecated_inline}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>The wheel button of a pointing device is rotated (detail attribute is a number of pixels). (use wheel instead)</td> - </tr> - <tr> - <td>{{event("MozOrientation")}} {{deprecated_inline}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>Fresh data is available from an orientation sensor (see deviceorientation).</td> - </tr> - <tr> - <td>{{event("MozScrolledAreaChanged")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td><em>Mozilla specific</em></td> - <td>The document view has been scrolled or resized.</td> - </tr> - <tr> - <td>{{event("moztimechange")}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>The time of the device has been changed.</td> - </tr> - <tr> - <td><a href="/en-US/DOM/Touch_events_(Mozilla_experimental)">MozTouchDown</a> {{deprecated_inline}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>A touch point is placed on the touch surface (use touchstart instead).</td> - </tr> - <tr> - <td><a href="/en-US/DOM/Touch_events_(Mozilla_experimental)">MozTouchMove</a> {{deprecated_inline}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>A touch point is moved along the touch surface (use touchmove instead).</td> - </tr> - <tr> - <td><a href="/en-US/DOM/Touch_events_(Mozilla_experimental)">MozTouchUp</a> {{deprecated_inline}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>A touch point is removed from the touch surface (use touchend instead).</td> - </tr> - <tr> - <td>{{event("alerting")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>The correspondent is being alerted (his/her phone is ringing).</td> - </tr> - <tr> - <td>{{event("busy")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>The line of the correspondent is busy.</td> - </tr> - <tr> - <td>{{event("callschanged")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>A call has been added or removed from the list of current calls.</td> - </tr> - <tr> - <td><a href="/en-US/docs/DOM/onconnected">onconnected</a> {{event("connected")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>A call has been connected.</td> - </tr> - <tr> - <td>{{event("connecting")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>A call is about to connect.</td> - </tr> - <tr> - <td>{{event("delivered")}}</td> - <td>{{domxref("SMSEvent")}}</td> - <td><em>To be specified</em></td> - <td>An SMS has been successfully delivered.</td> - </tr> - <tr> - <td>{{event("dialing")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>The number of a correspondent has been dialed.</td> - </tr> - <tr> - <td>{{event("disabled")}}</td> - <td></td> - <td><a href="http://mxr.mozilla.org/mozilla-central/source/dom/wifi/nsIWifi.idl?rev=3e586802f478#182"><em>Firefox OS specific</em></a></td> - <td>Wifi has been disabled on the device.</td> - </tr> - <tr> - <td>{{event("disconnected")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>A call has been disconnected.</td> - </tr> - <tr> - <td>{{event("disconnecting")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>A call is about to disconnect.</td> - </tr> - <tr> - <td>{{event("enabled")}}</td> - <td></td> - <td><a href="http://mxr.mozilla.org/mozilla-central/source/dom/wifi/nsIWifi.idl?rev=3e586802f478#182"><em>Firefox OS specific</em></a></td> - <td>Wifi has been enabled on the device.</td> - </tr> - <tr> - <td>{{event("error_(Telephony)","error")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>An error occurred.</td> - </tr> - <tr> - <td>{{event("held")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>A call has been held.</td> - </tr> - <tr> - <td>{{event("holding")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>A call is about to be held.</td> - </tr> - <tr> - <td>{{event("incoming")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>A call is being received.</td> - </tr> - <tr> - <td>{{event("received")}}</td> - <td>{{domxref("SMSEvent")}}</td> - <td><em>To be specified</em></td> - <td>An SMS has been received.</td> - </tr> - <tr> - <td>{{event("resuming")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>A call is about to resume.</td> - </tr> - <tr> - <td>{{event("sent")}}</td> - <td>{{domxref("SMSEvent")}}</td> - <td><em>To be specified</em></td> - <td>An SMS has been sent.</td> - </tr> - <tr> - <td>{{event("statechange")}}</td> - <td>{{domxref("CallEvent")}}</td> - <td><em>To be specified</em></td> - <td>The state of a call has changed.</td> - </tr> - <tr> - <td>{{event("statuschange")}}</td> - <td></td> - <td><a href="http://mxr.mozilla.org/mozilla-central/source/dom/wifi/nsIWifi.idl?rev=3e586802f478#156"><em>Firefox OS specific</em></a></td> - <td>The status of the Wifi connection changed.</td> - </tr> - <tr> - <td>{{event("overflow")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td><em>Mozilla specific</em></td> - <td>An element has been overflowed by its content or has been rendered for the first time in this state (only works for elements styled with <code>overflow</code> != <code>visible</code>).</td> - </tr> - <tr> - <td>{{event("smartcard-insert")}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>A <a href="/en-US/docs/JavaScript_crypto">smartcard</a> has been inserted.</td> - </tr> - <tr> - <td>{{event("smartcard-remove")}}</td> - <td></td> - <td><em>Mozilla specific</em></td> - <td>A <a href="/en-US/docs/JavaScript_crypto">smartcard</a> has been removed.</td> - </tr> - <tr> - <td>{{event("stkcommand")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>The <abbr title="SIM Application Toolkit">STK</abbr> Proactive Command is issued from <abbr title="Integrated Circuit Card">ICC</abbr>.</td> - </tr> - <tr> - <td>{{event("stksessionend")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>The <abbr title="SIM Application Toolkit">STK</abbr> Session is terminated by <abbr title="Integrated Circuit Card">ICC</abbr>.</td> - </tr> - <tr> - <td><code>text</code></td> - <td></td> - <td><em>Mozilla Specific</em></td> - <td>A generic composition event occurred.</td> - </tr> - <tr> - <td>{{event("underflow")}}</td> - <td>{{domxref("UIEvent")}}</td> - <td><em>Mozilla specific</em></td> - <td>An element is no longer overflowed by its content (only works for elements styled with <code>overflow</code> != <code>visible</code>).</td> - </tr> - <tr> - <td><code>uploadprogress</code> {{deprecated_inline}}</td> - <td>{{domxref("ProgressEvent")}}</td> - <td><em>Mozilla Specific</em></td> - <td>Upload is in progress (see {{event("progress")}}).</td> - </tr> - <tr> - <td> - <p>{{event("ussdreceived")}}</p> - </td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>A new <abbr title="Unstructured Supplementary Service Data">USSD</abbr> message is received</td> - </tr> - <tr> - <td>{{event("voicechange")}}</td> - <td></td> - <td><em>Firefox OS specific</em></td> - <td>The {{domxref("MozMobileConnection.voice")}} object changes values.</td> - </tr> - </tbody> -</table> - -<h2 id="Mozilla-specific_events">Mozilla-specific events</h2> - -<div class="note"> -<p><strong>Note:</strong> those events are never exposed to web content and can only be used in chrome content context.</p> +<div class="notecard note"> + <h4>Note</h4> + <p>Cette page répertorie les événements les plus courants que vous rencontrerez sur le Web. Si vous recherchez un événement qui n'est pas répertorié ici, essayez de rechercher son nom, son domaine ou les spécifications associées sur le reste du MDN.</p> </div> -<h3 id="XUL_events">XUL events</h3> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <th class="header" style="width: 220px;">Event Name</th> - <th class="header" style="width: 90px;">Event Type</th> - <th class="header" style="width: 100px;">Specification</th> - <th class="header">Fired when...</th> - </tr> - <tr> - <td>{{event("broadcast")}}</td> - <td></td> - <td><a href="/en-US/docs/XUL/Tutorial/Broadcasters_and_Observers#Broadcast_event">XUL</a></td> - <td>An <code>observer</code> noticed a change to the attributes of a watched broadcaster.</td> - </tr> - <tr> - <td>{{event("CheckboxStateChange")}}</td> - <td></td> - <td>XUL</td> - <td>The state of a <code>checkbox</code> has been changed either by a user action or by a script (useful for accessibility).</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/close_event">close</a></td> - <td></td> - <td>XUL</td> - <td>The close button of the window has been clicked.</td> - </tr> - <tr> - <td>{{event("command")}}</td> - <td></td> - <td>XUL</td> - <td>An element has been activated.</td> - </tr> - <tr> - <td>{{event("commandupdate")}}</td> - <td></td> - <td>XUL</td> - <td>A command update occurred on a <code>commandset</code> element.</td> - </tr> - <tr> - <td>{{event("DOMMenuItemActive")}}</td> - <td></td> - <td>XUL</td> - <td>A menu or menuitem has been hovered or highlighted.</td> - </tr> - <tr> - <td>{{event("DOMMenuItemInactive")}}</td> - <td></td> - <td><em>XUL</em></td> - <td>A menu or menuitem is no longer hovered or highlighted.</td> - </tr> - <tr> - <td>{{event("popuphidden")}}</td> - <td><code>PopupEvent</code></td> - <td><a href="/en-US/docs/XUL/PopupGuide/PopupEvents"><em>XUL</em></a></td> - <td>A menupopup, panel or tooltip has been hidden.</td> - </tr> - <tr> - <td>{{event("popuphiding")}}</td> - <td><code>PopupEvent</code></td> - <td><a href="/en-US/docs/XUL/PopupGuide/PopupEvents"><em>XUL</em></a></td> - <td>A menupopup, panel or tooltip is about to be hidden.</td> - </tr> - <tr> - <td>{{event("popupshowing")}}</td> - <td><code>PopupEvent</code></td> - <td><a href="/en-US/docs/XUL/PopupGuide/PopupEvents"><em>XUL</em></a></td> - <td>A menupopup, panel or tooltip is about to become visible.</td> - </tr> - <tr> - <td>{{event("popupshown")}}</td> - <td><code>PopupEvent</code></td> - <td><a href="/en-US/docs/XUL/PopupGuide/PopupEvents"><em>XUL</em></a></td> - <td>A menupopup, panel or tooltip has become visible.</td> - </tr> - <tr> - <td>{{event("RadioStateChange")}}</td> - <td></td> - <td>XUL</td> - <td>The state of a <code>radio</code> has been changed either by a user action or by a script (useful for accessibility).</td> - </tr> - <tr> - <td>{{event("ValueChange")}}</td> - <td></td> - <td>XUL</td> - <td>The value of an element has changed (a progress bar for example, useful for accessibility).</td> - </tr> - </tbody> -</table> - -<h3 id="Add-on-specific_events">Add-on-specific events</h3> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <th class="header" style="width: 220px;">Event Name</th> - <th class="header" style="width: 90px;">Event Type</th> - <th class="header" style="width: 100px;">Specification</th> - <th class="header">Fired when...</th> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozSwipeGesture">MozSwipeGesture</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A touch point is swiped across the touch surface</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozMagnifyGestureStart">MozMagnifyGestureStart</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Two touch points start to move away from each other.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozMagnifyGestureUpdate">MozMagnifyGestureUpdate</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Two touch points move away from each other (after a MozMagnifyGestureStart).</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozMagnifyGesture">MozMagnifyGesture</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Two touch points moved away from each other (after a sequence of MozMagnifyGestureUpdate).</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozRotateGestureStart">MozRotateGestureStart</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Two touch points start to rotate around a point.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozRotateGestureUpdate">MozRotateGestureUpdate</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Two touch points rotate around a point (after a MozRotateGestureStart).</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozRotateGesture">MozRotateGesture</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Two touch points rotate around a point (after a sequence of MozRotateGestureUpdate).</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozTapGesture">MozTapGesture</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Two touch points are tapped on the touch surface.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozPressTapGesture">MozPressTapGesture</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A "press-tap" gesture happened on the touch surface (first finger down, second finger down, second finger up, first finger up).</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozEdgeUIGesture">MozEdgeUIGesture</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A touch point is swiped across the touch surface to invoke the edge UI (Win8 only).</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozAfterPaint">MozAfterPaint</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Content has been repainted.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMPopupBlocked">DOMPopupBlocked</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A popup has been blocked</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMWindowCreated">DOMWindowCreated</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A window has been created.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMWindowClose">DOMWindowClose</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A window is about to be closed.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMTitleChanged">DOMTitleChanged</a></td> - <td></td> - <td><em>Addons specifc</em></td> - <td>The title of a window has changed.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMLinkAdded">DOMLinkAdded</a></td> - <td></td> - <td><em>Addons specifc</em></td> - <td>A link has been added a document.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMLinkRemoved">DOMLinkRemoved</a></td> - <td></td> - <td><em>Addons specifc</em></td> - <td>A link has been removed inside from a document.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMMetaAdded">DOMMetaAdded</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A <code>meta</code> element has been added to a document.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMMetaRemoved">DOMMetaRemoved</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A <code>meta</code> element has been removed from a document.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMWillOpenModalDialog">DOMWillOpenModalDialog</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A modal dialog is about to open.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMModalDialogClosed">DOMModalDialogClosed</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A modal dialog has been closed.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMAutoComplete">DOMAutoComplete</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>The content of an element has been auto-completed.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/DOMFrameContentLoaded">DOMFrameContentLoaded</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>The frame has finished loading (but not its dependent resources).</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/AlertActive">AlertActive</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A <code><a href="/en-US/docs/XUL/notification">notification</a></code> element is shown.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/AlertClose">AlertClose</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A <code><a href="/en-US/docs/XUL/notification">notification</a></code> element is closed.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/fullscreen">fullscreen</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Browser fullscreen mode has been entered or left.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/sizemodechange">sizemodechange</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>Window has entered/left fullscreen mode, or has been minimized/unminimized.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/MozEnteredDomFullscreen">MozEnteredDomFullscreen</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td><a href="/en-US/docs/DOM/Using_full-screen_mode">DOM fullscreen</a> mode has been entered.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/SSWindowClosing">SSWindowClosing</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>The session store will stop tracking this window.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/SSTabClosing">SSTabClosing</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>The session store will stop tracking this tab.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/SSTabRestoring">SSTabRestoring</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A tab is about to be restored.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/SSTabRestored">SSTabRestored</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A tab has been restored.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/SSWindowStateReady">SSWindowStateReady</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A window state has switched to "ready".</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/SSWindowStateBusy">SSWindowStateBusy</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A window state has switched to "busy".</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/tabviewsearchenabled">tabviewsearchenabled</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>The search feature of Panorama has been activated</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/tabviewsearchdisabled">tabviewsearchdisabled</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>The search feature of Panorama has been deactivated</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/tabviewframeinitialized">tabviewframeinitialized</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>The frame container of Panorama has been initialized</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/tabviewshown">tabviewshown</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>The Panorama tab has been shown</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/tabviewhidden">tabviewhidden</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>The Panorama tab has been hidden</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/TabOpen">TabOpen</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A tab has been opened.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/TabClose">TabClose</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A tab has been closed.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/TabSelect">TabSelect</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A tab has been selected.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/TabShow">TabShow</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A tab has been shown.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/TabHide">TabHide</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A tab has been hidden.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/TabPinned">TabPinned</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A tab has been pinned.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/TabUnpinned">TabUnpinned</a></td> - <td></td> - <td><em>Addons specific</em></td> - <td>A tab has been unpinned.</td> - </tr> - </tbody> -</table> - -<h3 id="Developer_tool-specific_events">Developer tool-specific events</h3> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <th class="header" style="width: 220px;">Event Name</th> - <th class="header" style="width: 90px;">Event Type</th> - <th class="header" style="width: 100px;">Specification</th> - <th class="header">Fired when...</th> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/CssRuleViewRefreshed">CssRuleViewRefreshed</a></td> - <td></td> - <td><em>devtools specific</em></td> - <td>The "Rules" view of the style inspector has been updated.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/CssRuleViewChanged">CssRuleViewChanged</a></td> - <td></td> - <td><em>devtools specific</em></td> - <td>The "Rules" view of the style inspector has been changed.</td> - </tr> - <tr> - <td><a href="/en-US/docs/Web/Reference/Events/CssRuleViewCSSLinkClicked">CssRuleViewCSSLinkClicked</a></td> - <td></td> - <td><em>devtools specific</em></td> - <td>A link to a CSS file has been clicked in the "Rules" view of the style inspector.</td> - </tr> - </tbody> +<h2 id="Index_des_événements">Index des événements</h2> + +<table class="standard-table" style="vertical-align: top"> + <tr> + <th>Type d'événement</th> + <th style="width: 50%">Description</th> + <th>Documentation</th> + </tr> + + <tr> + <td>Animation</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/Web_Animations_API">Web Animation API</a>.</p> + <p>Utilisé pour répondre aux changements d'état de l'animation (par exemple, lorsqu'une animation commence ou se termine).</p> + </td> + <td>Événements d'animation déclenchés sur <a href="/fr/docs/Web/API/Document#animation_events"><code>Document</code></a>, <a href="/fr/docs/Web/API/Window#animation_events"><code>Window</code></a>, <a href="/fr/docs/Web/API/HTMLElement#animation_events"><code>HTMLElement</code></a>.</td> + </tr> + + <tr> + <td>Récupération asynchrone des données</td> + <td> + <p>Événements liés à l'extraction des données.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/AbortSignal#events"><code>AbortSignal</code></a>, <a href="/fr/docs/Web/API/XMLHttpRequest#events"><code>XMLHttpRequest</code></a>, <a href="/fr/docs/Web/API/FileReader#events"><code>FileReader</code></a>.</td> + </tr> + + <tr> + <td>Presse-papiers</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/Clipboard_API">Clipboard API</a>.</p> + <p>Utilisé pour notifier lorsque le contenu est coupé, copié ou collé.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Document#clipboard_events"><code>Document</code></a>, <a href="/fr/docs/Web/API/Element#clipboard_events"><code>Element</code></a>, <a href="/fr/docs/Web/API/Window#clipboard_events"><code>Window</code></a>. + </td> + </tr> + + <tr> + <td>Composition</td> + <td> + <p>Événements liés à la composition ; saisie "indirecte" du texte (au lieu d'utiliser les touches normales du clavier).</p> + <p>Par exemple, un texte saisi via un moteur de conversion de la parole en texte, ou l'utilisation de combinaisons de touches spéciales qui modifient les pressions sur le clavier pour représenter de nouveaux caractères dans une autre langue.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Element#composition_events"><code>Element</code></a>. + </td> + </tr> + + <tr> + <td>Transition CSS</td> + <td> + <p>Événements liés aux <a href="/fr/docs/Web/CSS/CSS_Transitions">Transitions CSS</a>.</p> + <p>Fournit des événements de notification lorsque les transitions CSS commencent, s'arrêtent, sont annulées, etc.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Document#transition_events"><code>Document</code></a>, <a href="/fr/docs/Web/API/HTMLElement#transition_events"><code>HTMLElement</code></a>, <a href="/fr/docs/Web/API/Window#transition_events"><code>Window</code></a>.</td> + </tr> + + <tr> + <td>Base de données</td> + <td> + <p>Événements liés aux opérations de la base de données : ouverture, fermeture, transactions, erreurs, etc.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/IDBDatabase#events"><code>IDBDatabase</code></a>, <a href="/fr/docs/Web/API/IDBOpenDBRequest#events"><code>IDBOpenDBRequest</code></a>, <a href="/fr/docs/Web/API/IDBRequest#events"><code>IDBRequest</code></a>, <a href="/fr/docs/Web/API/IDBTransaction#events"><code>IDBTransaction</code></a>.</td> + </tr> + + <tr> + <td>Glisser/Déposer, Roue</td> + <td> + <p>Les événements liés à l'utilisation de l'API <a href="/fr/docs/Web/API/HTML_Drag_and_Drop_API">Glisser/Déposer</a> et <a href="/fr/docs/Web/API/WheelEvent">WheelEvent</a>.</p> + <p>Les événements Glisser/Déposer et Roue sont dérivés des événements de la souris. Bien qu'ils soient déclenchés lors de l'utilisation de la molette de la souris ou du glisser/déposer, ils peuvent également être utilisés avec d'autres matériels appropriés.</p> + </td> + <td> + <p>Les événements de Glisser/Déposer déclenchés sur <a href="/fr/docs/Web/API/Document#drag_drop_events"><code>Document</code></a></p> + <p>Les événements de la Roue déclenchés sur <a href="/fr/docs/Web/API/Document/wheel_event"><code>Document</code></a> et <a href="/fr/docs/Web/API/Element/wheel_event"><code>Element</code></a></p> + </td> + </tr> + + <tr> + <td>Focus</td> + <td> + <p>Les événements liés aux éléments qui gagnent et perdent le focus.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Element#focus_events"><code>Element</code></a>, <a href="/fr/docs/Web/API/Window#focus_events"><code>Window</code></a>. + </td> + </tr> + + <tr> + <td>Formulaire</td> + <td> + <p>Événements liés à la construction, la réinitialisation et la soumission de formulaires.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/HTMLFormElement#events"><code>HTMLFormElement</code></a>. + </td> + </tr> + + <tr> + <td>Plein écran</td> + <td> + <p>Evénements relatifs à l'API <a href="/fr/docs/Web/API/Fullscreen_API">Fullscreen API</a>.</p> + <p>Utilisé pour notifier la transition entre le mode plein écran et le mode fenêtré, ainsi que les erreurs survenant pendant cette transition.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Document#fullscreen_events"><code>Document</code></a>, <a href="/fr/docs/Web/API/Element#fullscreen_events"><code>Element</code></a>.</td> + </tr> + + <tr> + <td>Manette de jeu</td> + <td> + <p>Evénements relatifs à l'API <a href="/fr/docs/Web/API/Gamepad_API">Gamepad API</a>.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Window#gamepad_events"><code>Window</code></a>. + </td> + </tr> + + <tr> + <td>Historique</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/History_API">de Manipulation de l'historique du navigateur</a>.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Window#history_events"><code>Window</code></a>. + </td> + </tr> + + <tr> + <td>Gestion de l'affichage du contenu des éléments HTML</td> + <td> + <p>Événements liés à la modification de l'état d'un élément d'affichage ou textuel.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/HTMLDetailsElement#events"><code>HTMLDetailsElement</code></a>, <a href="/fr/docs/Web/API/HTMLDialogElement#events"><code>HTMLDialogElement</code></a>, <a href="/fr/docs/Web/API/HTMLSlotElement#events"><code>HTMLSlotElement</code></a>. + </td> + </tr> + + <tr> + <td>Entrées</td> + <td> + <p>Événements liés aux éléments d'entrée HTML, par ex. {{HTMLElement("input")}}, {{HTMLElement("select")}}, ou {{HTMLElement("textarea")}}.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/HTMLElement#input_events"><code>HTMLElement</code></a>, <a href="/fr/docs/Web/API/HTMLInputElement#events"><code>HTMLInputElement</code></a>.</td> + </tr> + + <tr> + <td>Clavier</td> + <td> + <p>Événements liés à l'utilisation d'un <a href="/fr/docs/Web/API/KeyboardEvent">clavier</a>.</p> + <p>Utilisé pour notifier lorsque les touches sont déplacées vers le haut, vers le bas, ou simplement pressées.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Document#keyboard_events"><code>Document</code></a>, <a href="/fr/docs/Web/API/Element#keyboard_events"><code>Element</code></a>. + </td> + </tr> + + <tr> + <td>Chargement/déchargement des documents</td> + <td> + <p>Événements liés au chargement et au déchargement des documents.</p> + </td> + <td> + <p>Événements déclenchés sur <a href="/fr/docs/Web/API/Document#load_unload_events"><code>Document</code></a> et <a href="/fr/docs/Web/API/Window#load_unload_events"><code>Window</code></a>.</p> + </td> + </tr> + + <tr> + <td>Manifeste</td> + <td> + <p>Événements liés à l'installation de <a href="/fr/docs/Web/Manifest">Manifeste des applications web</a>.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Window#manifest_events"><code>Window</code></a>.</td> + </tr> + + <tr> + <td>Médias</td> + <td> + <p>Événements liés à l'utilisation des médias (y compris l'<a href="/fr/docs/Web/API/Media_Streams_API#events">API de capture et de diffusion de médias</a>, <a href="/fr/docs/Web/API/Web_Audio_API#events">Web Audio API</a>, <a href="/fr/docs/Web/API/Picture-in-Picture_API#events">Picture-in-Picture API</a>, etc.).</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/ScriptProcessorNode#events"><code>ScriptProcessorNode</code></a>, <a href="/fr/docs/Web/API/HTMLMediaElement#events"><code>HTMLMediaElement</code></a>, <a href="/fr/docs/Web/API/AudioTrackList#events"><code>AudioTrackList</code></a>, <a href="/fr/docs/Web/API/AudioScheduledSourceNode#events"><code>AudioScheduledSourceNode</code></a>, <a href="/fr/docs/Web/API/MediaRecorder#events"><code>MediaRecorder</code></a>, <a href="/fr/docs/Web/API/MediaStream#events"><code>MediaStream</code></a>, <a href="/fr/docs/Web/API/MediaStreamTrack"><code>MediaStreamTrack</code></a>, <a href="/fr/docs/Web/API/VideoTrackList#events"><code>VideoTrackList</code></a>, <a href="/fr/docs/Web/API/HTMLTrackElement#events"><code>HTMLTrackElement</code></a>, <a href="/fr/docs/Web/API/OfflineAudioContext#events"><code>OfflineAudioContext</code></a>, <a href="/fr/docs/Web/API/TextTrack#events"><code>TextTrack</code></a>, <a href="/fr/docs/Web/API/TextTrackList#events"><code>TextTrackList</code></a>, <a href="/fr/docs/Web/HTML/Element/audio#events">Element/audio</a>, <a href="/fr/docs/Web/HTML/Element/video#events">Element/video</a>. + </td> + </tr> + + <tr> + <td>Messagerie</td> + <td> + <p>Événements liés à la réception par une fenêtre d'un message provenant d'un autre contexte de navigation.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Window#messaging_events"><code>Window</code></a>.</td> + </tr> + + <tr> + <td>Souris</td> + <td> + <p>Événements liés à l'utilisation d'une <a href="/fr/docs/Web/API/MouseEvent">souris d'ordinateur</a>.</p> + <p>Utilisé pour notifier le clic de la souris, le double-clic, les événements haut et bas, le clic droit, le déplacement dans et hors d'un élément, la sélection de texte, etc.</p> + <p>Les événements de type pointeur constituent une alternative aux événements de type souris, indépendamment du matériel utilisé. Les événements de type "glisser" et "roue" sont dérivés des événements de type "souris".</p> + </td> + <td>Les événements de souris déclenchés sur <a href="/fr/docs/Web/API/Element#mouse_events"><code>Element</code></a></td> + </tr> + + <tr> + <td>Réseau/Connexion</td> + <td> + <p>Événements liés à l'obtention et à la perte d'une connexion réseau.</p> + </td> + <td> + <p>Événements déclenchés sur <a href="/fr/docs/Web/API/Window#connection_events"><code>Window</code></a>.</p> + <p>Événements déclenchés sur <a href="/fr/docs/Web/API/NetworkInformation#event_handler"><code>NetworkInformation</code></a> (<a href="/fr/docs/Web/API/Network_Information_API">Network Information API</a>).</p> + </td> + </tr> + + <tr> + <td>Paiements</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/Payment_Request_API">Payment Request API</a>.</p> + </td> + <td> + <p>Événements déclenchés sur <a href="/fr/docs/Web/API/PaymentRequest#events"><code>PaymentRequest</code></a>, <a href="/fr/docs/Web/API/PaymentResponse#events"><code>PaymentResponse</code></a>.</p> + </td> + </tr> + + <tr> + <td>Performance</td> + <td> + <p>Événements liés aux APIs <a href="/fr/docs/Web/API/Performance_API">Performance API</a>, <a href="/fr/docs/Web/API/Performance_Timeline">Performance Timeline API</a>, <a href="/fr/docs/Web/API/Navigation_timing_API">Navigation Timing API</a>, <a href="/fr/docs/Web/API/User_Timing_API">User Timing API</a>, et <a href="/fr/docs/Web/API/Resource_Timing_API">Resource Timing API</a>.</p> + </td> + <td> + <p>Événements déclenchés sur <a href="/fr/docs/Web/API/Performance#events"><code>Performance</code></a>.</p> + </td> + </tr> + + <tr> + <td>Pointeur</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/Pointer_events">Pointer Events API</a>.</p> + <p>Fournit une notification agnostique du matériel à partir des dispositifs de pointage, y compris la souris, la souris tactile, le stylo/stylet.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Document#pointer_events"><code>Document</code></a>, <a href="/fr/docs/Web/API/HTMLElement#pointer_events"><code>HTMLElement</code></a>.</td> + </tr> + + <tr> + <td>Imprimer</td> + <td> + <p>Événements liés à l'impression.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Window#print_events"><code>Window</code></a>.</td> + </tr> + + <tr> + <td>Rejet de promesse</td> + <td> + <p>Événements envoyés au contexte global du script lorsqu'une promesse JavaScript est rejetée.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Window#promise_rejection_events"><code>Window</code></a>.</td> + </tr> + + <tr> + <td>Sockets</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/WebSockets_API">WebSockets API</a>.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/WebSocket#events"><code>Websocket</code></a>.</td> + </tr> + + <tr> + <td>SVG</td> + <td> + <p>Événements liés aux images SVG.</p> + </td> + <td> + <p>Événements déclenchés sur <a href="/fr/docs/Web/API/SVGElement#events"><code>SVGElement</code></a>, <a href="/fr/docs/Web/API/SVGAnimationElement#events"><code>SVGAnimationElement</code></a>, <a href="/fr/docs/Web/API/SVGGraphicsElement#events"><code>SVGGraphicsElement</code></a>.</p> + </td> + </tr> + + <tr> + <td>Sélection de texte</td> + <td> + <p>Événements liés à la <a href="/fr/docs/Web/API/Selection">sélection du texte</a>.</p> + </td> + <td> + <p>Événements déclenchés sur <a href="/fr/docs/Web/API/Document#selection_events"><code>Document</code></a>.</p> + </td> + </tr> + + <tr> + <td>Tactile</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/Touch_events">Événements tactiles</a>.</p> + <p>Fournit des événements de notification provenant de l'interaction avec un écran tactile (c'est-à-dire l'utilisation d'un doigt ou d'un stylet). Non lié à l'API <a href="/fr/docs/Web/API/Force_Touch_events#events">Force Touch API</a>.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/Document#touch_events"><code>Document</code></a>, <a href="/fr/docs/Web/API/Element#touch_events"><code>Element</code></a>.</td> + </tr> + + <tr> + <td>Réalité virtuelle</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/WebXR_Device_API">WebXR Device API</a>.</p> + <div class="notecard note"> + <p>L'API <a href="/fr/docs/Web/API/WebVR_API">WebVR API</a> (et les événements associés à <a href="/fr/docs/Web/API/Window#webvr_events"><code>Window</code></a>) sont dépréciés.</p> + </div> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/XRSystem#events"><code>XRSystem</code></a>, <a href="/fr/docs/Web/API/XRSession#events"><code>XRSession</code></a>, <a href="/fr/docs/Web/API/XRReferenceSpace#events"><code>XRReferenceSpace</code></a>.</td> + </tr> + + <tr> + <td>RTC (communication en temps réel)</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/WebRTC_API">WebRTC API</a>.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/RTCDataChannel#events"><code>RTCDataChannel</code></a>, <a href="/fr/docs/Web/API/RTCDTMFSender#events"><code>RTCDTMFSender</code></a>, <a href="/fr/docs/Web/API/RTCIceTransport#events"><code>RTCIceTransport</code></a>, <a href="/fr/docs/Web/API/RTCPeerConnection#events"><code>RTCPeerConnection</code></a>.</td> + </tr> + + <tr> + <td>Événements envoyés par le serveur</td> + <td> + <p>Les événements liés à l'<a href="/fr/docs/Web/API/Server-sent_events">API des événements envoyés par le serveur</a>.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/EventSource#events"><code>EventSource</code></a>. + </td> + </tr> + + <tr> + <td>Synthèse vocale</td> + <td> + <p>Les événements liés à l'API <a href="/fr/docs/Web/API/Web_Speech_API">Web Speech API</a>.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/SpeechSynthesisUtterance#events"><code>SpeechSynthesisUtterance</code></a>.</td> + </tr> + + <tr> + <td>Workers</td> + <td> + <p>Les événements liés aux APIs <a href="/fr/docs/Web/API/Web_Workers_API">Web Workers API</a>, <a href="/fr/docs/Web/API/Service_Worker_API">Service Worker API</a>, <a href="/fr/docs/Web/API/Broadcast_Channel_API">Broadcast Channel API</a>, et <a href="/fr/docs/Web/API/Channel_Messaging_API">Channel Messaging API</a>.</p> + <p>Utilisé pour répondre aux nouveaux messages et aux erreurs d'envoi de messages. Les travailleurs de service peuvent également être notifiés d'autres événements, notamment les notifications push, les utilisateurs qui cliquent sur les notifications affichées, le fait que l'abonnement push a été invalidé, la suppression d'éléments de l'index de contenu, etc.</p> + </td> + <td>Événements déclenchés sur <a href="/fr/docs/Web/API/ServiceWorkerGlobalScope#events"><code>ServiceWorkerGlobalScope</code></a>, <a href="/fr/docs/Web/API/DedicatedWorkerGlobalScope#events"><code>DedicatedWorkerGlobalScope</code></a>, <a href="/fr/docs/Web/API/SharedWorkerGlobalScope#events"><code>SharedWorkerGlobalScope</code></a>, <a href="/fr/docs/Web/API/WorkerGlobalScope#events"><code>WorkerGlobalScope</code></a>, <a href="/fr/docs/Web/API/Worker#events"><code>Worker</code></a>, <a href="/fr/docs/Web/API/WorkerGlobalScope#events"><code>WorkerGlobalScope</code></a>, <a href="/fr/docs/Web/API/BroadcastChannel#events"><code>BroadcastChannel</code></a>, <a href="/fr/docs/Web/API/MessagePort#events"><code>MessagePort</code></a>. + </td> + </tr> </table> -<h2 id="Categories">Categories</h2> - -<h3 id="Animation_events">Animation events</h3> - -<p>{{event("animationend")}}, {{event("animationiteration")}}, {{event("animationstart")}}, {{event("beginEvent")}}, {{event("endEvent")}}, {{event("repeatEvent")}}</p> - -<h3 id="Battery_events">Battery events</h3> - -<p>{{event("chargingchange")}} {{event("chargingtimechange")}}, {{event("dischargingtimechange")}} {{event("levelchange")}}</p> - -<h3 id="Call_events">Call events</h3> - -<p>{{event("alerting")}}, {{event("busy")}}, {{event("callschanged")}} {{event("cfstatechange")}}, {{event("connected")}}, {{event("connecting")}}, {{event("dialing")}}, {{event("disconnected")}}, {{event("disconnecting")}}, {{event("error_(Telephony)","error")}}, {{event("held")}}, {{event("holding")}}, {{event("incoming")}}, {{event("resuming")}}, {{event("statechange")}}, {{event("voicechange")}}</p> - -<h3 id="CSS_events">CSS events</h3> - -<p><a href="/en-US/docs/Web/Reference/Events/CssRuleViewRefreshed">CssRuleViewRefreshed</a>, <a href="/en-US/docs/Web/Reference/Events/CssRuleViewChanged">CssRuleViewChanged</a>, <a href="/en-US/docs/Web/Reference/Events/CssRuleViewCSSLinkClicked">CssRuleViewCSSLinkClicked</a>, {{event("transitionend")}}</p> - -<h3 id="Database_events">Database events</h3> - -<p><code><a href="/en-US/docs/Web/Reference/Events/abort_indexedDB">abort</a></code>, <code><a href="/en-US/docs/Web/Reference/Events/blocked_indexedDB">blocked</a></code>, <code><a href="/en-US/docs/Web/Reference/Events/complete_indexedDB">complete</a></code>, {{event("error")}} (<a href="/en-US/docs/Web/Reference/Events/error">link</a>), <code><a href="/en-US/docs/Web/Reference/Events/success_indexedDB">success</a></code>, <code><a href="/en-US/docs/Web/Reference/Events/upgradeneeded_indexedDB">upgradeneeded</a></code>, <code><a href="/en-US/docs/Web/Reference/Events/versionchange_indexedDB">versionchange</a></code></p> - -<h3 id="Document_events">Document events</h3> - -<p><a href="/en-US/docs/Web/Reference/Events/DOMLinkAdded">DOMLinkAdded</a>, <a href="/en-US/docs/Web/Reference/Events/DOMLinkRemoved">DOMLinkRemoved</a>, <a href="/en-US/docs/Web/Reference/Events/DOMMetaAdded">DOMMetaAdded</a>, <a href="/en-US/docs/Web/Reference/Events/DOMMetaRemoved">DOMMetaRemoved</a>, <a href="/en-US/docs/Web/Reference/Events/DOMWillOpenModalDialog">DOMWillOpenModalDialog</a>, <a href="/en-US/docs/Web/Reference/Events/DOMModalDialogClosed">DOMModalDialogClosed</a>, {{event("unload")}}</p> - -<h3 id="DOM_mutation_events">DOM mutation events</h3> - -<p>code><a href="/en-US/docs/DOM/Mutation_events">DOMAttributeNameChanged</a>, <code><a href="/en-US/docs/DOM/Mutation_events">DOMAttrModified</a></code>, <code><a href="/en-US/docs/DOM/Mutation_events">DOMCharacterDataModified</a></code>, {{event("DOMContentLoaded")}}, <code><a href="/en-US/docs/DOM/Mutation_events">DOMElementNameChanged</a></code>, <code><a href="/en-US/docs/DOM/Mutation_events">DOMNodeInserted</a></code>, <code><a href="/en-US/docs/DOM/Mutation_events">DOMNodeInsertedIntoDocument</a></code>, <code><a href="/en-US/docs/DOM/Mutation_events">DOMNodeRemoved</a></code>, <code><a href="/en-US/docs/DOM/Mutation_events">DOMNodeRemovedFromDocument</a></code>, <code><a href="/en-US/docs/DOM/Mutation_events">DOMSubtreeModified</a></code></p> - -<h3 id="Drag_events">Drag events</h3> - -<p>{{event("drag")}}, <code>dragdrop</code>, {{event("dragend")}}, {{event("dragenter")}}, <code>dragexit</code>, <code>draggesture</code>, {{event("dragleave")}}, {{event("dragover")}}, {{event("dragstart")}}, {{event("drop")}}</p> - -<h3 id="Element_events">Element events</h3> - -<p>{{event("invalid")}}, {{event("overflow")}}, {{event("underflow")}}, <a href="/en-US/docs/Web/Reference/Events/DOMAutoComplete">DOMAutoComplete</a>, {{event("command")}}, {{event("commandupdate")}}</p> - -<h3 id="Focus_events">Focus events</h3> - -<p>{{event("blur")}}, {{event("change")}}, <code>DOMFocusIn</code>, <code>DOMFocusOut</code>, {{event("focus")}}, {{event("focusin")}}, {{event("focusout")}}</p> - -<h3 id="Form_events">Form events</h3> - -<p>{{event("reset")}}, {{event("submit")}}</p> - -<h3 id="Frame_events">Frame events</h3> - -<p>{{event("mozbrowserclose")}}, {{event("mozbrowsercontextmenu")}}, {{event("mozbrowsererror")}}, {{event("mozbrowsericonchange")}}, {{event("mozbrowserlocationchange")}}, {{event("mozbrowserloadend")}}, {{event("mozbrowserloadstart")}}, {{event("mozbrowseropenwindow")}}, {{event("mozbrowsersecuritychange")}}, {{event("mozbrowsershowmodalprompt")}} (<a href="/en-US/docs/Web/Reference/Events/mozbrowsershowmodalprompt">link</a>), {{event("mozbrowsertitlechange")}}, <a href="/en-US/docs/Web/Reference/Events/DOMFrameContentLoaded">DOMFrameContentLoaded</a></p> - -<h3 id="Input_device_events">Input device events</h3> - -<p>{{event("click")}}, {{event("contextmenu")}}, {{event("DOMMouseScroll")}}, {{event("dblclick")}}, {{event("gamepadconnected")}}, {{event("gamepaddisconnected")}}, {{event("keydown")}}, {{event("keypress")}}, {{event("keyup")}}, {{event("MozGamepadButtonDown")}}, {{event("MozGamepadButtonUp")}}, {{event("mousedown")}}, {{event("mouseenter")}}, {{event("mouseleave")}}, {{event("mousemove")}}, {{event("mouseout")}}, {{event("mouseover")}}, {{event("mouseup")}}, {{event("mousewheel")}}, {{event("MozMousePixelScroll")}}, {{event("pointerlockchange")}}, {{event("pointerlockerror")}},{{event("wheel")}}</p> - -<h3 id="Media_events">Media events</h3> - -<p>{{event("audioprocess")}}, {{event("canplay")}}, {{event("canplaythrough")}}, {{event("durationchange")}}, {{event("emptied")}}, {{event("ended")}}, {{event("ended_(Web_Audio)", "ended")}}, {{event("loadeddata")}}, {{event("loadedmetadata")}}, {{event("MozAudioAvailable")}}, {{event("pause")}}, {{event("play")}}, {{event("playing")}}, {{event("ratechange")}}, {{event("seeked")}}, {{event("seeking")}}, {{event("stalled")}}, {{event("suspend")}}, {{event("timeupdate")}}, {{event("volumechange")}}, {{event("waiting")}}, {{event("complete")}}</p> - -<h3 id="Menu_events">Menu events</h3> - -<p>{{event("DOMMenuItemActive")}}, {{event("DOMMenuItemInactive")}}</p> - -<h3 id="Network_events">Network events</h3> - -<p>{{event("datachange")}}, {{event("dataerror")}}, {{event("disabled")}}, {{event("enabled")}}, {{event("offline")}}, {{event("online")}}, {{event("statuschange")}}, {{event("connectionInfoUpdate")}},</p> - -<h3 id="Notification_events">Notification events</h3> - -<p><a href="/en-US/docs/Web/Reference/Events/AlertActive">AlertActive</a>, <a href="/en-US/docs/Web/Reference/Events/AlertClose">AlertClose</a></p> - -<h3 id="Popup_events">Popup events</h3> - -<p>{{event("popuphidden")}}, {{event("popuphiding")}}, {{event("popupshowing")}}, {{event("popupshown")}}, <a href="/en-US/docs/Web/Reference/Events/DOMPopupBlocked">DOMPopupBlocked</a></p> - -<h3 id="Printing_events">Printing events</h3> - -<p>{{event("afterprint")}}, {{event("beforeprint")}}</p> - -<h3 id="Progress_events">Progress events</h3> - -<p><code><a href="/en-US/docs/Web/Reference/Events/abort_(ProgressEvent)">abort</a></code>, {{event("error")}}, <code><a href="/en-US/docs/Web/Reference/Events/load_(ProgressEvent)">load</a></code>, {{event("loadend")}}, {{event("loadstart")}}, {{event("progress")}}, <code><a href="/en-US/docs/Web/Reference/Events/progress_(appcache_event)">progress</a></code>, {{event("timeout")}}, <code>uploadprogress</code></p> - -<h3 id="Resource_events">Resource events</h3> - -<p>{{event("abort")}}, {{event("cached")}}, {{event("error")}}, {{event("load")}}</p> - -<h3 id="Script_events">Script events</h3> - -<p>{{event("afterscriptexecute")}}, {{event("beforescriptexecute")}}</p> - -<h3 id="Sensor_events">Sensor events</h3> - -<p>{{event("compassneedscalibration")}}, {{event("devicelight")}}, {{event("devicemotion")}}, {{event("deviceorientation")}}, {{event("deviceproximity")}}, {{event("MozOrientation")}}, {{event("orientationchange")}}, {{event("userproximity")}}</p> - -<h3 id="Session_history_events">Session history events</h3> - -<p>{{event("pagehide")}}, {{event("pageshow")}}, {{event("popstate")}}</p> - -<h3 id="Smartcard_events">Smartcard events</h3> - -<p>{{event("icccardlockerror")}}, {{event("iccinfochange")}}, {{event("smartcard-insert")}}, {{event("smartcard-remove")}}, {{event("stkcommand")}}, {{event("stksessionend")}}, {{event("cardstatechange")}}</p> - -<h3 id="SMS_and_USSD_events">SMS and USSD events</h3> - -<p>{{event("delivered")}}, {{event("received")}}, {{event("sent")}}, {{event("ussdreceived")}}</p> - -<h3 id="Storage_events">Storage events</h3> - -<p>{{event("change")}}, {{event("storage")}}</p> - -<h3 id="SVG_events">SVG events</h3> - -<p>{{event("SVGAbort")}}, {{event("SVGError")}}, {{event("SVGLoad")}}, {{event("SVGResize")}}, {{event("SVGScroll")}}, {{event("SVGUnload")}}, {{event("SVGZoom")}}</p> - -<h3 id="Tab_events">Tab events</h3> - -<p><a href="/en-US/docs/Web/Reference/Events/tabviewsearchenabled">tabviewsearchenabled</a>, <a href="/en-US/docs/Web/Reference/Events/tabviewsearchdisabled">tabviewsearchdisabled</a>, <a href="/en-US/docs/Web/Reference/Events/tabviewframeinitialized">tabviewframeinitialized</a>, <a href="/en-US/docs/Web/Reference/Events/tabviewshown">tabviewshown</a>, <a href="/en-US/docs/Web/Reference/Events/tabviewhidden">tabviewhidden</a>, <a href="/en-US/docs/Web/Reference/Events/TabOpen">TabOpen</a>, <a href="/en-US/docs/Web/Reference/Events/TabClose">TabClose</a>, <a href="/en-US/docs/Web/Reference/Events/TabSelect">TabSelect</a>, <a href="/en-US/docs/Web/Reference/Events/TabShow">TabShow</a>, <a href="/en-US/docs/Web/Reference/Events/TabHide">TabHide</a>, <a href="/en-US/docs/Web/Reference/Events/TabPinned">TabPinned</a>, <a href="/en-US/docs/Web/Reference/Events/TabUnpinned">TabUnpinned</a>, <a href="/en-US/docs/Web/Reference/Events/SSTabClosing">SSTabClosing</a>, <a href="/en-US/docs/Web/Reference/Events/SSTabRestoring">SSTabRestoring</a>, <a href="/en-US/docs/Web/Reference/Events/SSTabRestored">SSTabRestored</a>, {{event("visibilitychange")}}</p> - -<h3 id="Text_events">Text events</h3> - -<p>{{event("compositionend")}}, {{event("compositionstart")}}, {{event("compositionupdate")}}, {{event("copy")}}, {{event("cut")}}, {{event("paste")}}, {{event("select")}}, <code>text</code></p> - -<h3 id="Touch_events">Touch events</h3> - -<p><a href="/en-US/docs/Web/Reference/Events/MozEdgeUIGesture">MozEdgeUIGesture</a>, <a href="/en-US/docs/Web/Reference/Events/MozMagnifyGesture">MozMagnifyGesture</a>, <a href="/en-US/docs/Web/Reference/Events/MozMagnifyGestureStart">MozMagnifyGestureStart</a>, <a href="/en-US/docs/Web/Reference/Events/MozMagnifyGestureUpdate">MozMagnifyGestureUpdate</a>, <a href="/en-US/docs/Web/Reference/Events/MozPressTapGesture">MozPressTapGesture</a>, <a href="/en-US/docs/Web/Reference/Events/MozRotateGesture">MozRotateGesture</a>, <a href="/en-US/docs/Web/Reference/Events/MozRotateGestureStart">MozRotateGestureStart</a>, <a href="/en-US/docs/Web/Reference/Events/MozRotateGestureUpdate">MozRotateGestureUpdate</a>, <a href="/en-US/docs/Web/Reference/Events/MozSwipeGesture">MozSwipeGesture</a>, <a href="/en-US/docs/Web/Reference/Events/MozTapGesture">MozTapGesture</a>, <a href="/en-US/DOM/Touch_events_(Mozilla_experimental)">MozTouchDown</a>, <a href="/en-US/DOM/Touch_events_(Mozilla_experimental)">MozTouchMove</a>, <a href="/en-US/DOM/Touch_events_(Mozilla_experimental)">MozTouchUp</a>, {{event("touchcancel")}}, {{event("touchend")}}, {{event("touchenter")}}, {{event("touchleave")}}, {{event("touchmove")}}, {{event("touchstart")}}</p> - -<h3 id="Update_events">Update events</h3> - -<p>{{event("checking")}}, {{event("downloading")}}, {{event("error")}}, {{event("noupdate")}}, {{event("obsolete")}}, {{event("updateready")}}</p> - -<h3 id="Value_change_events">Value change events</h3> - -<p>{{event("broadcast")}}, {{event("CheckboxStateChange")}}, {{event("hashchange")}}, {{event("input")}}, {{event("RadioStateChange")}}, {{event("readystatechange")}}, {{event("ValueChange")}}</p> - -<h3 id="View_events">View events</h3> - -<p><a href="/en-US/docs/Web/Reference/Events/fullscreen">fullscreen</a>, {{event("fullscreenchange")}}, {{event("fullscreenerror")}}, <a href="/en-US/docs/Web/Reference/Events/MozEnteredDomFullscreen">MozEnteredDomFullscreen</a>, {{event("MozScrolledAreaChanged")}}, {{event("resize")}}, {{event("scroll")}}, <a href="/en-US/docs/Web/Reference/Events/sizemodechange">sizemodechange</a></p> - -<h3 id="Événements_Websocket">Événements Websocket</h3> - -<p><code><a href="/en-US/docs/Web/Reference/Events/close_websocket">close</a></code>, {{event("error")}}, <code><a href="/en-US/docs/Web/Reference/Events/message_websocket">message</a></code>, <code><a href="/en-US/docs/Web/Reference/Events/open_websocket">open</a></code></p> - -<h3 id="Événements_de_fenêtre">Événements de fenêtre</h3> - -<p><a href="/en-US/docs/Web/Reference/Events/DOMWindowCreated">DOMWindowCreated</a>, <a href="/en-US/docs/Web/Reference/Events/DOMWindowClose">DOMWindowClose</a>, <a href="/en-US/docs/Web/Reference/Events/DOMTitleChanged">DOMTitleChanged</a>, <a href="/en-US/docs/Web/Reference/Events/MozBeforeResize">MozBeforeResize</a> {{obsolete_inline}}, <a href="/en-US/docs/Web/Reference/Events/SSWindowClosing">SSWindowClosing</a>, <a href="/en-US/docs/Web/Reference/Events/SSWindowStateReady">SSWindowStateReady</a>, <a href="/en-US/docs/Web/Reference/Events/SSWindowStateBusy">SSWindowStateBusy</a>, <a href="/en-US/docs/Web/Reference/Events/close_event">close</a></p> - -<h3 id="Événements_non_classés">Événements non classés</h3> - -<p>{{event("beforeunload")}}, {{event("localized")}}, <code><a href="/en-US/docs/Web/Reference/Events/message_webworker">message</a></code>, <code><a href="/en-US/docs/Web/Reference/Events/message_webmessaging">message</a></code>, <code><a href="/en-US/docs/Web/Reference/Events/message_serversentevents">message</a></code>, <a href="/en-US/docs/Web/Reference/Events/MozAfterPaint">MozAfterPaint</a>, {{event("moztimechange")}}, <code><a href="/en-US/docs/Web/Reference/Events/open_serversentevents">open</a></code>, {{event("show")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li>{{domxref("Event")}}</li> - <li><a href="/en-US/docs/Web/Guide/DOM/Events">Event developer guide</a></li> -</ul> +<h2 id="Listing_des_événements">Listing des événements</h2> + +<p>Cette section répertorie les événements qui ont <em>leurs propres</em> pages de référence sur MDN. Si vous êtes intéressé par un événement qui n'est pas listé ici, essayez de rechercher son nom, son domaine ou les spécifications associées sur le reste de MDN.</p> + +<dl> + <dt>{{DOMxRef("AbortSignal")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/AbortSignal/abort_event">abort event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("AudioScheduledSourceNode")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/AudioScheduledSourceNode/ended_event">ended event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("AudioTrackList")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/AudioTrackList/addtrack_event">addtrack event</a></li> + <li><a href="/fr/docs/Web/API/AudioTrackList/change_event">change event</a></li> + <li><a href="/fr/docs/Web/API/AudioTrackList/removetrack_event">removetrack event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("BroadcastChannel")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/BroadcastChannel/messageerror_event">messageerror event</a></li> + <li><a href="/fr/docs/Web/API/BroadcastChannel/message_event">message event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("DedicatedWorkerGlobalScope")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/DedicatedWorkerGlobalScope/messageerror_event">messageerror event</a></li> + <li><a href="/fr/docs/Web/API/DedicatedWorkerGlobalScope/message_event">message event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("Document")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/Document/animationcancel_event">animationcancel event</a></li> + <li><a href="/fr/docs/Web/API/Document/animationend_event">animationend event</a></li> + <li><a href="/fr/docs/Web/API/Document/animationiteration_event">animationiteration event</a></li> + <li><a href="/fr/docs/Web/API/Document/animationstart_event">animationstart event</a></li> + <li><a href="/fr/docs/Web/API/Document/copy_event">copy event</a></li> + <li><a href="/fr/docs/Web/API/Document/cut_event">cut event</a></li> + <li><a href="/fr/docs/Web/API/Document/DOMContentLoaded_event">DOMContentLoaded event</a></li> + <li><a href="/fr/docs/Web/API/Document/dragend_event">dragend event</a></li> + <li><a href="/fr/docs/Web/API/Document/dragenter_event">dragenter event</a></li> + <li><a href="/fr/docs/Web/API/Document/dragleave_event">dragleave event</a></li> + <li><a href="/fr/docs/Web/API/Document/dragover_event">dragover event</a></li> + <li><a href="/fr/docs/Web/API/Document/dragstart_event">dragstart event</a></li> + <li><a href="/fr/docs/Web/API/Document/drag_event">drag event</a></li> + <li><a href="/fr/docs/Web/API/Document/drop_event">drop event</a></li> + <li><a href="/fr/docs/Web/API/Document/fullscreenchange_event">fullscreenchange event</a></li> + <li><a href="/fr/docs/Web/API/Document/fullscreenerror_event">fullscreenerror event</a></li> + <li><a href="/fr/docs/Web/API/Document/gotpointercapture_event">gotpointercapture event</a></li> + <li><a href="/fr/docs/Web/API/Document/keydown_event">keydown event</a></li> + <li><a href="/fr/docs/Web/API/Document/keypress_event">keypress event</a></li> + <li><a href="/fr/docs/Web/API/Document/keyup_event">keyup event</a></li> + <li><a href="/fr/docs/Web/API/Document/lostpointercapture_event">lostpointercapture event</a></li> + <li><a href="/fr/docs/Web/API/Document/paste_event">paste event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointercancel_event">pointercancel event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointerdown_event">pointerdown event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointerenter_event">pointerenter event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointerleave_event">pointerleave event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointerlockchange_event">pointerlockchange event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointerlockerror_event">pointerlockerror event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointermove_event">pointermove event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointerout_event">pointerout event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointerover_event">pointerover event</a></li> + <li><a href="/fr/docs/Web/API/Document/pointerup_event">pointerup event</a></li> + <li><a href="/fr/docs/Web/API/Document/readystatechange_event">readystatechange event</a></li> + <li><a href="/fr/docs/Web/API/Document/scroll_event">scroll event</a></li> + <li><a href="/fr/docs/Web/API/Document/selectionchange_event">selectionchange event</a></li> + <li><a href="/fr/docs/Web/API/Document/selectstart_event">selectstart event</a></li> + <li><a href="/fr/docs/Web/API/Document/touchcancel_event">touchcancel event</a></li> + <li><a href="/fr/docs/Web/API/Document/touchend_event">touchend event</a></li> + <li><a href="/fr/docs/Web/API/Document/touchmove_event">touchmove event</a></li> + <li><a href="/fr/docs/Web/API/Document/touchstart_event">touchstart event</a></li> + <li><a href="/fr/docs/Web/API/Document/transitioncancel_event">transitioncancel event</a></li> + <li><a href="/fr/docs/Web/API/Document/transitionend_event">transitionend event</a></li> + <li><a href="/fr/docs/Web/API/Document/transitionrun_event">transitionrun event</a></li> + <li><a href="/fr/docs/Web/API/Document/transitionstart_event">transitionstart event</a></li> + <li><a href="/fr/docs/Web/API/Document/visibilitychange_event">visibilitychange event</a></li> + <li><a href="/fr/docs/Web/API/Document/wheel_event">wheel event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("Element")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/Element/afterscriptexecute_event">afterscriptexecute event</a></li> + <li><a href="/fr/docs/Web/API/Element/auxclick_event">auxclick event</a></li> + <li><a href="/fr/docs/Web/API/Element/beforescriptexecute_event">beforescriptexecute event</a></li> + <li><a href="/fr/docs/Web/API/Element/blur_event">blur event</a></li> + <li><a href="/fr/docs/Web/API/Element/click_event">click event</a></li> + <li><a href="/fr/docs/Web/API/Element/compositionend_event">compositionend event</a></li> + <li><a href="/fr/docs/Web/API/Element/compositionstart_event">compositionstart event</a></li> + <li><a href="/fr/docs/Web/API/Element/compositionupdate_event">compositionupdate event</a></li> + <li><a href="/fr/docs/Web/API/Element/contextmenu_event">contextmenu event</a></li> + <li><a href="/fr/docs/Web/API/Element/copy_event">copy event</a></li> + <li><a href="/fr/docs/Web/API/Element/cut_event">cut event</a></li> + <li><a href="/fr/docs/Web/API/Element/dblclick_event">dblclick event</a></li> + <li><a href="/fr/docs/Web/API/Element/DOMActivate_event">DOMActivate event</a></li> + <li><a href="/fr/docs/Web/API/Element/DOMMouseScroll_event">DOMMouseScroll event</a></li> + <li><a href="/fr/docs/Web/API/Element/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/Element/focusin_event">focusin event</a></li> + <li><a href="/fr/docs/Web/API/Element/focusout_event">focusout event</a></li> + <li><a href="/fr/docs/Web/API/Element/focus_event">focus event</a></li> + <li><a href="/fr/docs/Web/API/Element/fullscreenchange_event">fullscreenchange event</a></li> + <li><a href="/fr/docs/Web/API/Element/fullscreenerror_event">fullscreenerror event</a></li> + <li><a href="/fr/docs/Web/API/Element/gesturechange_event">gesturechange event</a></li> + <li><a href="/fr/docs/Web/API/Element/gestureend_event">gestureend event</a></li> + <li><a href="/fr/docs/Web/API/Element/gesturestart_event">gesturestart event</a></li> + <li><a href="/fr/docs/Web/API/Element/keydown_event">keydown event</a></li> + <li><a href="/fr/docs/Web/API/Element/keypress_event">keypress event</a></li> + <li><a href="/fr/docs/Web/API/Element/keyup_event">keyup event</a></li> + <li><a href="/fr/docs/Web/API/Element/mousedown_event">mousedown event</a></li> + <li><a href="/fr/docs/Web/API/Element/mouseenter_event">mouseenter event</a></li> + <li><a href="/fr/docs/Web/API/Element/mouseleave_event">mouseleave event</a></li> + <li><a href="/fr/docs/Web/API/Element/mousemove_event">mousemove event</a></li> + <li><a href="/fr/docs/Web/API/Element/mouseout_event">mouseout event</a></li> + <li><a href="/fr/docs/Web/API/Element/mouseover_event">mouseover event</a></li> + <li><a href="/fr/docs/Web/API/Element/mouseup_event">mouseup event</a></li> + <li><a href="/fr/docs/Web/API/Element/mousewheel_event">mousewheel event</a></li> + <li><a href="/fr/docs/Web/API/Element/msContentZoom_event">msContentZoom event</a></li> + <li><a href="/fr/docs/Web/API/Element/MSGestureChange_event">MSGestureChange event</a></li> + <li><a href="/fr/docs/Web/API/Element/MSGestureEnd_event">MSGestureEnd event</a></li> + <li><a href="/fr/docs/Web/API/Element/MSGestureHold_event">MSGestureHold event</a></li> + <li><a href="/fr/docs/Web/API/Element/MSGestureStart_event">MSGestureStart event</a></li> + <li><a href="/fr/docs/Web/API/Element/MSGestureTap_event">MSGestureTap event</a></li> + <li><a href="/fr/docs/Web/API/Element/MSInertiaStart_event">MSInertiaStart event</a></li> + <li><a href="/fr/docs/Web/API/Element/MSManipulationStateChanged_event">MSManipulationStateChanged event</a></li> + <li><a href="/fr/docs/Web/API/Element/overflow_event">overflow event</a></li> + <li><a href="/fr/docs/Web/API/Element/paste_event">paste event</a></li> + <li><a href="/fr/docs/Web/API/Element/scroll_event">scroll event</a></li> + <li><a href="/fr/docs/Web/API/Element/select_event">select event</a></li> + <li><a href="/fr/docs/Web/API/Element/show_event">show event</a></li> + <li><a href="/fr/docs/Web/API/Element/touchcancel_event">touchcancel event</a></li> + <li><a href="/fr/docs/Web/API/Element/touchend_event">touchend event</a></li> + <li><a href="/fr/docs/Web/API/Element/touchmove_event">touchmove event</a></li> + <li><a href="/fr/docs/Web/API/Element/touchstart_event">touchstart event</a></li> + <li><a href="/fr/docs/Web/API/Element/underflow_event">underflow event</a></li> + <li><a href="/fr/docs/Web/API/Element/webkitmouseforcechanged_event">webkitmouseforcechanged event</a></li> + <li><a href="/fr/docs/Web/API/Element/webkitmouseforcedown_event">webkitmouseforcedown event</a></li> + <li><a href="/fr/docs/Web/API/Element/webkitmouseforceup_event">webkitmouseforceup event</a></li> + <li><a href="/fr/docs/Web/API/Element/webkitmouseforcewillbegin_event">webkitmouseforcewillbegin event</a></li> + <li><a href="/fr/docs/Web/API/Element/wheel_event">wheel event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("EventSource")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/EventSource/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/EventSource/message_event">message event</a></li> + <li><a href="/fr/docs/Web/API/EventSource/open_event">open event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("FileReader")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/FileReader/abort_event">abort event</a></li> + <li><a href="/fr/docs/Web/API/FileReader/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/FileReader/loadend_event">loadend event</a></li> + <li><a href="/fr/docs/Web/API/FileReader/loadstart_event">loadstart event</a></li> + <li><a href="/fr/docs/Web/API/FileReader/load_event">load event</a></li> + <li><a href="/fr/docs/Web/API/FileReader/progress_event">progress event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLCanvasElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLCanvasElement/webglcontextcreationerror_event">webglcontextcreationerror event</a></li> + <li><a href="/fr/docs/Web/API/HTMLCanvasElement/webglcontextlost_event">webglcontextlost event</a></li> + <li><a href="/fr/docs/Web/API/HTMLCanvasElement/webglcontextrestored_event">webglcontextrestored event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLDetailsElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLDetailsElement/toggle_event">toggle event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLDialogElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLDialogElement/cancel_event">cancel event</a></li> + <li><a href="/fr/docs/Web/API/HTMLDialogElement/close_event">close event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLElement/animationcancel_event">animationcancel event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/animationend_event">animationend event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/animationiteration_event">animationiteration event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/animationstart_event">animationstart event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/beforeinput_event">beforeinput event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/change_event">change event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/gotpointercapture_event">gotpointercapture event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/input_event">input event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/lostpointercapture_event">lostpointercapture event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/pointercancel_event">pointercancel event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/pointerdown_event">pointerdown event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/pointerenter_event">pointerenter event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/pointerleave_event">pointerleave event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/pointermove_event">pointermove event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/pointerout_event">pointerout event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/pointerover_event">pointerover event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/pointerup_event">pointerup event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/transitioncancel_event">transitioncancel event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/transitionend_event">transitionend event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/transitionrun_event">transitionrun event</a></li> + <li><a href="/fr/docs/Web/API/HTMLElement/transitionstart_event">transitionstart event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLFormElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLFormElement/formdata_event">formdata event</a></li> + <li><a href="/fr/docs/Web/API/HTMLFormElement/reset_event">reset event</a></li> + <li><a href="/fr/docs/Web/API/HTMLFormElement/submit_event">submit event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLInputElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLInputElement/invalid_event">invalid event</a></li> + <li><a href="/fr/docs/Web/API/HTMLInputElement/search_event">search event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLMediaElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/abort_event">abort event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/canplaythrough_event">canplaythrough event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/canplay_event">canplay event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/durationchange_event">durationchange event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/emptied_event">emptied event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/ended_event">ended event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/loadeddata_event">loadeddata event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/loadedmetadata_event">loadedmetadata event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/loadstart_event">loadstart event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/pause_event">pause event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/playing_event">playing event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/play_event">play event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/progress_event">progress event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/ratechange_event">ratechange event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/seeked_event">seeked event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/seeking_event">seeking event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/stalled_event">stalled event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/suspend_event">suspend event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/timeupdate_event">timeupdate event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/volumechange_event">volumechange event</a></li> + <li><a href="/fr/docs/Web/API/HTMLMediaElement/waiting_event">waiting event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLSlotElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLSlotElement/slotchange_event">slotchange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLTrackElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLTrackElement/cuechange_event">cuechange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("HTMLVideoElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/HTMLVideoElement/enterpictureinpicture_event">enterpictureinpicture event</a></li> + <li><a href="/fr/docs/Web/API/HTMLVideoElement/leavepictureinpicture_event">leavepictureinpicture event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("IDBDatabase")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/IDBDatabase/abort_event">abort event</a></li> + <li><a href="/fr/docs/Web/API/IDBDatabase/close_event">close event</a></li> + <li><a href="/fr/docs/Web/API/IDBDatabase/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/IDBDatabase/versionchange_event">versionchange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("IDBOpenDBRequest")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/IDBOpenDBRequest/blocked_event">blocked event</a></li> + <li><a href="/fr/docs/Web/API/IDBOpenDBRequest/upgradeneeded_event">upgradeneeded event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("IDBRequest")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/IDBRequest/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/IDBRequest/success_event">success event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("IDBTransaction")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/IDBTransaction/abort_event">abort event</a></li> + <li><a href="/fr/docs/Web/API/IDBTransaction/complete_event">complete event</a></li> + <li><a href="/fr/docs/Web/API/IDBTransaction/error_event">error event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("MediaDevices")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/MediaDevices/devicechange_event">devicechange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("MediaRecorder")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/MediaRecorder/error_event">error event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("MediaStream")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/MediaStream/addtrack_event">addtrack event</a></li> + <li><a href="/fr/docs/Web/API/MediaStream/removetrack_event">removetrack event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("MediaStreamTrack")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/MediaStreamTrack/ended_event">ended event</a></li> + <li><a href="/fr/docs/Web/API/MediaStreamTrack/mute_event">mute event</a></li> + <li><a href="/fr/docs/Web/API/MediaStreamTrack/unmute_event">unmute event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("MessagePort")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/MessagePort/messageerror_event">messageerror event</a></li> + <li><a href="/fr/docs/Web/API/MessagePort/message_event">message event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("OfflineAudioContext")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/OfflineAudioContext/complete_event">complete event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("PaymentRequest")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/PaymentRequest/merchantvalidation_event">merchantvalidation event</a></li> + <li><a href="/fr/docs/Web/API/PaymentRequest/paymentmethodchange_event">paymentmethodchange event</a></li> + <li><a href="/fr/docs/Web/API/PaymentRequest/shippingaddresschange_event">shippingaddresschange event</a></li> + <li><a href="/fr/docs/Web/API/PaymentRequest/shippingoptionchange_event">shippingoptionchange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("PaymentResponse")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/PaymentResponse/payerdetailchange_event">payerdetailchange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("Performance")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/Performance/resourcetimingbufferfull_event">resourcetimingbufferfull event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("PictureInPictureWindow")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/PictureInPictureWindow/resize_event">resize event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("RTCDataChannel")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/RTCDataChannel/bufferedamountlow_event">bufferedamountlow event</a></li> + <li><a href="/fr/docs/Web/API/RTCDataChannel/close_event">close event</a></li> + <li><a href="/fr/docs/Web/API/RTCDataChannel/closing_event">closing event</a></li> + <li><a href="/fr/docs/Web/API/RTCDataChannel/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/RTCDataChannel/message_event">message event</a></li> + <li><a href="/fr/docs/Web/API/RTCDataChannel/open_event">open event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("RTCDtlsTransport")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/RTCDtlsTransport/error_event">error event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("RTCDTMFSender")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/RTCDTMFSender/tonechange_event">tonechange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("RTCIceTransport")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/RTCIceTransport/gatheringstatechange_event">gatheringstatechange event</a></li> + <li><a href="/fr/docs/Web/API/RTCIceTransport/selectedcandidatepairchange_event">selectedcandidatepairchange event</a></li> + <li><a href="/fr/docs/Web/API/RTCIceTransport/statechange_event">statechange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("RTCPeerConnection")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/addstream_event">addstream event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/connectionstatechange_event">connectionstatechange event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/datachannel_event">datachannel event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/icecandidateerror_event">icecandidateerror event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/icecandidate_event">icecandidate event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/iceconnectionstatechange_event">iceconnectionstatechange event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/icegatheringstatechange_event">icegatheringstatechange event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/identityresult_event">identityresult event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/idpassertionerror_event">idpassertionerror event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/idpvalidationerror_event">idpvalidationerror event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/negotiationneeded_event">negotiationneeded event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/peeridentity_event">peeridentity event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/removestream_event">removestream event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/signalingstatechange_event">signalingstatechange event</a></li> + <li><a href="/fr/docs/Web/API/RTCPeerConnection/track_event">track event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("ScriptProcessorNode")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/ScriptProcessorNode/audioprocess_event">audioprocess event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("ServiceWorkerContainer")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/ServiceWorkerContainer/message_event">message event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("ServiceWorkerGlobalScope")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/ServiceWorkerGlobalScope/activate_event">activate event</a></li> + <li><a href="/fr/docs/Web/API/ServiceWorkerGlobalScope/contentdelete_event">contentdelete event</a></li> + <li><a href="/fr/docs/Web/API/ServiceWorkerGlobalScope/install_event">install event</a></li> + <li><a href="/fr/docs/Web/API/ServiceWorkerGlobalScope/message_event">message event</a></li> + <li><a href="/fr/docs/Web/API/ServiceWorkerGlobalScope/notificationclick_event">notificationclick event</a></li> + <li><a href="/fr/docs/Web/API/ServiceWorkerGlobalScope/pushsubscriptionchange_event">pushsubscriptionchange event</a></li> + <li><a href="/fr/docs/Web/API/ServiceWorkerGlobalScope/push_event">push event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("SharedWorkerGlobalScope")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/SharedWorkerGlobalScope/connect_event">connect event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("SpeechRecognition")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/SpeechRecognition/audioend_event">audioend event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/audiostart_event">audiostart event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/end_event">end event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/nomatch_event">nomatch event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/result_event">result event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/soundend_event">soundend event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/soundstart_event">soundstart event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/speechend_event">speechend event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/speechstart_event">speechstart event</a></li> + <li><a href="/fr/docs/Web/API/SpeechRecognition/start_event">start event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("SpeechSynthesis")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/SpeechSynthesis/voiceschanged_event">voiceschanged event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("SpeechSynthesisUtterance")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/SpeechSynthesisUtterance/boundary_event">boundary event</a></li> + <li><a href="/fr/docs/Web/API/SpeechSynthesisUtterance/end_event">end event</a></li> + <li><a href="/fr/docs/Web/API/SpeechSynthesisUtterance/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/SpeechSynthesisUtterance/mark_event">mark event</a></li> + <li><a href="/fr/docs/Web/API/SpeechSynthesisUtterance/pause_event">pause event</a></li> + <li><a href="/fr/docs/Web/API/SpeechSynthesisUtterance/resume_event">resume event</a></li> + <li><a href="/fr/docs/Web/API/SpeechSynthesisUtterance/start_event">start event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("SVGAnimationElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/SVGAnimationElement/beginEvent_event">beginEvent event</a></li> + <li><a href="/fr/docs/Web/API/SVGAnimationElement/endEvent_event">endEvent event</a></li> + <li><a href="/fr/docs/Web/API/SVGAnimationElement/repeatEvent_event">repeatEvent event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("SVGElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/SVGElement/abort_event">abort event</a></li> + <li><a href="/fr/docs/Web/API/SVGElement/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/SVGElement/load_event">load event</a></li> + <li><a href="/fr/docs/Web/API/SVGElement/resize_event">resize event</a></li> + <li><a href="/fr/docs/Web/API/SVGElement/scroll_event">scroll event</a></li> + <li><a href="/fr/docs/Web/API/SVGElement/unload_event">unload event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("SVGGraphicsElement")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/SVGGraphicsElement/copy_event">copy event</a></li> + <li><a href="/fr/docs/Web/API/SVGGraphicsElement/cut_event">cut event</a></li> + <li><a href="/fr/docs/Web/API/SVGGraphicsElement/paste_event">paste event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("TextTrack")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/TextTrack/cuechange_event">cuechange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("TextTrackList")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/TextTrackList/addtrack_event">addtrack event</a></li> + <li><a href="/fr/docs/Web/API/TextTrackList/change_event">change event</a></li> + <li><a href="/fr/docs/Web/API/TextTrackList/removeTrack_event">removeTrack event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("VideoTrackList")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/VideoTrackList/addtrack_event">addtrack event</a></li> + <li><a href="/fr/docs/Web/API/VideoTrackList/change_event">change event</a></li> + <li><a href="/fr/docs/Web/API/VideoTrackList/removetrack_event">removetrack event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("VisualViewport")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/VisualViewport/resize_event">resize event</a></li> + <li><a href="/fr/docs/Web/API/VisualViewport/scroll_event">scroll event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("WebSocket")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/WebSocket/close_event">close event</a></li> + <li><a href="/fr/docs/Web/API/WebSocket/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/WebSocket/message_event">message event</a></li> + <li><a href="/fr/docs/Web/API/WebSocket/open_event">open event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("Window")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/Window/afterprint_event">afterprint event</a></li> + <li><a href="/fr/docs/Web/API/Window/animationcancel_event">animationcancel event</a></li> + <li><a href="/fr/docs/Web/API/Window/animationend_event">animationend event</a></li> + <li><a href="/fr/docs/Web/API/Window/animationiteration_event">animationiteration event</a></li> + <li><a href="/fr/docs/Web/API/Window/animationstart_event">animationstart event</a></li> + <li><a href="/fr/docs/Web/API/Window/appinstalled_event">appinstalled event</a></li> + <li><a href="/fr/docs/Web/API/Window/beforeprint_event">beforeprint event</a></li> + <li><a href="/fr/docs/Web/API/Window/beforeunload_event">beforeunload event</a></li> + <li><a href="/fr/docs/Web/API/Window/blur_event">blur event</a></li> + <li><a href="/fr/docs/Web/API/Window/copy_event">copy event</a></li> + <li><a href="/fr/docs/Web/API/Window/cut_event">cut event</a></li> + <li><a href="/fr/docs/Web/API/Window/devicemotion_event">devicemotion event</a></li> + <li><a href="/fr/docs/Web/API/Window/deviceorientation_event">deviceorientation event</a></li> + <li><a href="/fr/docs/Web/API/Window/DOMContentLoaded_event">DOMContentLoaded event</a></li> + <li><a href="/fr/docs/Web/API/Window/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/Window/focus_event">focus event</a></li> + <li><a href="/fr/docs/Web/API/Window/gamepadconnected_event">gamepadconnected event</a></li> + <li><a href="/fr/docs/Web/API/Window/gamepaddisconnected_event">gamepaddisconnected event</a></li> + <li><a href="/fr/docs/Web/API/Window/hashchange_event">hashchange event</a></li> + <li><a href="/fr/docs/Web/API/Window/languagechange_event">languagechange event</a></li> + <li><a href="/fr/docs/Web/API/Window/load_event">load event</a></li> + <li><a href="/fr/docs/Web/API/Window/messageerror_event">messageerror event</a></li> + <li><a href="/fr/docs/Web/API/Window/message_event">message event</a></li> + <li><a href="/fr/docs/Web/API/Window/offline_event">offline event</a></li> + <li><a href="/fr/docs/Web/API/Window/online_event">online event</a></li> + <li><a href="/fr/docs/Web/API/Window/orientationchange_event">orientationchange event</a></li> + <li><a href="/fr/docs/Web/API/Window/pagehide_event">pagehide event</a></li> + <li><a href="/fr/docs/Web/API/Window/pageshow_event">pageshow event</a></li> + <li><a href="/fr/docs/Web/API/Window/paste_event">paste event</a></li> + <li><a href="/fr/docs/Web/API/Window/popstate_event">popstate event</a></li> + <li><a href="/fr/docs/Web/API/Window/rejectionhandled_event">rejectionhandled event</a></li> + <li><a href="/fr/docs/Web/API/Window/resize_event">resize event</a></li> + <li><a href="/fr/docs/Web/API/Window/storage_event">storage event</a></li> + <li><a href="/fr/docs/Web/API/Window/transitioncancel_event">transitioncancel event</a></li> + <li><a href="/fr/docs/Web/API/Window/transitionend_event">transitionend event</a></li> + <li><a href="/fr/docs/Web/API/Window/transitionrun_event">transitionrun event</a></li> + <li><a href="/fr/docs/Web/API/Window/transitionstart_event">transitionstart event</a></li> + <li><a href="/fr/docs/Web/API/Window/unhandledrejection_event">unhandledrejection event</a></li> + <li><a href="/fr/docs/Web/API/Window/unload_event">unload event</a></li> + <li><a href="/fr/docs/Web/API/Window/vrdisplayactivate_event">vrdisplayactivate event</a></li> + <li><a href="/fr/docs/Web/API/Window/vrdisplayblur_event">vrdisplayblur event</a></li> + <li><a href="/fr/docs/Web/API/Window/vrdisplayconnect_event">vrdisplayconnect event</a></li> + <li><a href="/fr/docs/Web/API/Window/vrdisplaydeactivate_event">vrdisplaydeactivate event</a></li> + <li><a href="/fr/docs/Web/API/Window/vrdisplaydisconnect_event">vrdisplaydisconnect event</a></li> + <li><a href="/fr/docs/Web/API/Window/vrdisplayfocus_event">vrdisplayfocus event</a></li> + <li><a href="/fr/docs/Web/API/Window/vrdisplaypointerrestricted_event">vrdisplaypointerrestricted event</a></li> + <li><a href="/fr/docs/Web/API/Window/vrdisplaypointerunrestricted_event">vrdisplaypointerunrestricted event</a></li> + <li><a href="/fr/docs/Web/API/Window/vrdisplaypresentchange_event">vrdisplaypresentchange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("Worker")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/Worker/messageerror_event">messageerror event</a></li> + <li><a href="/fr/docs/Web/API/Worker/message_event">message event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("WorkerGlobalScope")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/WorkerGlobalScope/languagechange_event">languagechange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("XMLHttpRequest")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/XMLHttpRequest/abort_event">abort event</a></li> + <li><a href="/fr/docs/Web/API/XMLHttpRequest/error_event">error event</a></li> + <li><a href="/fr/docs/Web/API/XMLHttpRequest/loadend_event">loadend event</a></li> + <li><a href="/fr/docs/Web/API/XMLHttpRequest/loadstart_event">loadstart event</a></li> + <li><a href="/fr/docs/Web/API/XMLHttpRequest/load_event">load event</a></li> + <li><a href="/fr/docs/Web/API/XMLHttpRequest/progress_event">progress event</a></li> + <li><a href="/fr/docs/Web/API/XMLHttpRequest/timeout_event">timeout event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("XRReferenceSpace")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/XRReferenceSpace/reset_event">reset event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("XRSession")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/XRSession/end_event">end event</a></li> + <li><a href="/fr/docs/Web/API/XRSession/inputsourceschange_event">inputsourceschange event</a></li> + <li><a href="/fr/docs/Web/API/XRSession/selectend_event">selectend event</a></li> + <li><a href="/fr/docs/Web/API/XRSession/selectstart_event">selectstart event</a></li> + <li><a href="/fr/docs/Web/API/XRSession/select_event">select event</a></li> + <li><a href="/fr/docs/Web/API/XRSession/squeezeend_event">squeezeend event</a></li> + <li><a href="/fr/docs/Web/API/XRSession/squeezestart_event">squeezestart event</a></li> + <li><a href="/fr/docs/Web/API/XRSession/squeeze_event">squeeze event</a></li> + <li><a href="/fr/docs/Web/API/XRSession/visibilitychange_event">visibilitychange event</a></li> + </ul> + </dd> + <dt>{{DOMxRef("XRSystem")}}</dt> + <dd> + <ul> + <li><a href="/fr/docs/Web/API/XRSystem/devicechange_event">devicechange event</a></li> + </ul> + </dd> +</dl> diff --git a/files/fr/web/html/element/figcaption/index.html b/files/fr/web/html/element/figcaption/index.html index 4269caaa03..d03cbf7e74 100644 --- a/files/fr/web/html/element/figcaption/index.html +++ b/files/fr/web/html/element/figcaption/index.html @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/figcaption <pre class="brush: html"><!-- Une image avec une légende : figcaption --> <figure> - <img src="https://developer.cdn.mozilla.net/media/img/mdn-logo-sm.png" alt="Une superbe photo"> + <img src="https://developer.mozilla.org/static/img/favicon144.png" alt="Une superbe photo"> <figcaption>Une légende pour cette photo</figcaption> </figure> diff --git a/files/fr/web/html/element/menuitem/index.html b/files/fr/web/html/element/menuitem/index.html index da6873ec18..e8befe4362 100644 --- a/files/fr/web/html/element/menuitem/index.html +++ b/files/fr/web/html/element/menuitem/index.html @@ -56,7 +56,7 @@ translation_of: Web/HTML/Element/menuitem <menu type="context" id="popup-menu"> <menuitem type="checkbox" checked>Une case à cocher</menuitem> <hr> - <menuitem type="command" label="Cette commande ne fait rien" icon="https://developer.cdn.mozilla.net/static/img/favicon144.png"> + <menuitem type="command" label="Cette commande ne fait rien" icon="https://developer.mozilla.org/static/img/favicon144.png"> Les commandes n'affichent pas leurs contenus. </menuitem> <menuitem type="command" label="Cette commande contient du JavAScript" onclick="alert('command clicked')"> diff --git a/files/fr/web/http/basics_of_http/evolution_of_http/index.html b/files/fr/web/http/basics_of_http/evolution_of_http/index.html index fdda44f6a0..30f3797c38 100644 --- a/files/fr/web/http/basics_of_http/evolution_of_http/index.html +++ b/files/fr/web/http/basics_of_http/evolution_of_http/index.html @@ -118,7 +118,7 @@ Vary: Cookie, Accept-Encoding GET /static/img/header-background.png HTTP/1.1 -Host: developer.cdn.mozilla.net +Host: developer.mozilla.org User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:50.0) Gecko/20100101 Firefox/50.0 Accept: */* Accept-Language: en-US,en;q=0.5 diff --git a/files/fr/web/http/headers/host/index.html b/files/fr/web/http/headers/host/index.html index 609a96469b..54d66674d2 100644 --- a/files/fr/web/http/headers/host/index.html +++ b/files/fr/web/http/headers/host/index.html @@ -44,7 +44,7 @@ translation_of: Web/HTTP/Headers/Host <h2 id="Exemples">Exemples</h2> -<pre>Host: developer.cdn.mozilla.net</pre> +<pre>Host: developer.mozilla.org</pre> <h2 id="Spécifications">Spécifications</h2> diff --git a/files/fr/web/index.html b/files/fr/web/index.html index b163873dc4..034f0cb6f1 100644 --- a/files/fr/web/index.html +++ b/files/fr/web/index.html @@ -2,111 +2,40 @@ title: Technologies web pour développeurs slug: Web tags: - - Développement Web - - Technologie + - Landing - Web translation_of: Web --- -<p>Le Web ouvert offre une opportunité incroyable aux personnes qui veulent créer des sites ou des applications en ligne. Pour tirer le meilleur parti de ces technologies, il faut savoir comment les utiliser. Vous trouverez ci-dessous les liens vers notre documentation à propos des technologies web.</p> +<p>Le Web fournit d'incroyables opportunités aux développeuses et développeurs. Pour tirer le meilleur parti de ces technologies, il est nécessaire de savoir comment les utiliser. Voici différents liens qui vous permettront de naviguer dans la documentation de ces technologies web.</p> -<div class="row topicpage-table"> -<div class="section"> -<h2 class="Documentation" id="Technologies_web">Technologies web</h2> - -<h3 id="Les_bases">Les bases</h3> +<h2 class="Documentation" id="Docs_for_developers">Documentation pour le développement web</h2> <dl> - <dt><a href="/fr/docs/Web/HTML">HTML</a></dt> - <dd><strong>HyperText Markup Language</strong> (langage de balisage hypertexte ou <strong>HTML</strong>) est le langage utilisé pour décrire et définir le <em>contenu</em> d'une page web.</dd> - <dt><a href="/fr/docs/Web/CSS">CSS</a></dt> - <dd><strong>Cascading Style Sheets</strong> (feuilles de style en cascade ou <strong>CSS</strong>) est utilisé pour décrire l'apparence du contenu d'une page web.</dd> - <dt><a href="/fr/docs/Web/HTTP">HTTP</a></dt> - <dd><strong><dfn>Hypertext Transfer Protocol <em>(HTTP</em>)</dfn></strong> est un protocole de <a href="https://fr.wikipedia.org/wiki/Couche_application">la couche application</a>, orienté client-serveur, qui permet le transfert de documents web tels que des documents HTML.</dd> + <dt><a href="/fr/docs/Web/Reference">Références</a></dt> + <dd>Une liste de l'ensemble des références sur les technologies web dont celles sur HTML, CSS, etc.</dd> + <dt><a href="/fr/docs/Web/Guide">Guides</a></dt> + <dd>Cette page fournit différents tutoriels pour vous aider à manipuler les technologies web afin de réaliser ce que vous souhaitez.</dd> + <dt><a href="/fr/docs/Web/Tutorials">Tutoriels</a></dt> + <dd>Une liste de tutoriels qui progressent étape par étape pour apprendre les API, langages et autres sujets.</dd> + <dt><a href="/fr/docs/Web/Progressive_web_apps">Les applications web progressives (<i>Progressive Web Applications</i> ou PWA en anglais)</a></dt> + <dd>Les applications web progressives sont des applications web qui utilisent les API et les fonctionnalités du navigateur ainsi que des stratégies d'amélioration progressive afin d'apporter une expérience utilisateur semblable aux applications natives et qui puissent fonctionner sur les différentes plateformes web.</dd> </dl> -<h3 id="Script">Script</h3> +<h2 class="Documentation" id="Web_technology_references">Références des technologies web</h2> <dl> + <dt><a href="/fr/docs/Web/Reference/API">API Web</a></dt> + <dd>Les références pour l'ensemble des API qui permettent de rendre le Web interactif et scriptable. On y trouve notamment le DOM, les diverses interfaces et API utilisées pour construire du contenu et des applications web.</dd> + <dt><a href="/fr/docs/Web/HTML">HTML</a></dt> + <dd><i>HyperText Markup Language</i> est le langage utilisé pour décrire et définir le contenu d'une page web.</dd> + <dt><a href="/fr/docs/Web/CSS">CSS</a></dt> + <dd><i>Cascading Style Sheets</i> est le langage utilisé pour décrire l'apparence du contenu web.</dd> <dt><a href="/fr/docs/Web/JavaScript">JavaScript</a></dt> - <dd><strong>JavaScript </strong>est le langage de programmation exécuté du côté de votre navigateur. Vous pouvez l'utiliser pour ajouter un côté interactif et dynamique a votre site web ou application.</dd> - <dd>Avec l'avènement de <a href="/fr/docs/Glossaire/Node.js">Node.js</a>, vous pouvez également exécuter JavaScript sur le serveur.</dd> - <dt><a href="/fr/docs/Web/API">Les API web</a></dt> - <dd>Les <strong>interfaces de programmation d'application Web (API Web)</strong> sont utilisées pour effectuer une variété de tâches, telles que la manipulation du <a href="/fr/docs/DOM">DOM</a>, la lecture audio ou vidéo, ou la génération de graphiques 3D. - <ul> - <li><a href="/fr/docs/Web/API">La référence des interfaces des différentes API web</a> : toutes les interfaces, triées par ordre alphabétique.</li> - <li><a href="/fr/docs/WebAPI">WebAPI</a> : cette page liste les API d’accès aux composants des appareils, ainsi que d’autres API utiles pour les applications.</li> - <li><a href="/fr/docs/Web/Events">La référence des évènements</a> décrit l'ensemble des évènements qui peuvent être utilisés pour réagir aux évènements marquants qui se sont produits dans une page web ou une application.</li> - </ul> - </dd> - <dt><a href="/fr/docs/Web/Web_Components">Web components</a></dt> - <dd><strong>Web Components</strong> est une suite de différentes technologies vous permettant de créer des éléments personnalisés réutilisables - avec leurs fonctionnalités encapsulées à l'écart du reste de votre code - et les utiliser dans vos applications Web.</dd> -</dl> - -<h3 id="Graphiques">Graphiques</h3> - -<dl> - <dt><a href="/fr/docs/Web/HTML/Canvas">Canvas</a></dt> - <dd>L'élément {{HTMLElement("<em><strong>canvas</strong></em>")}} délivre des APIs pour dessiner des graphiques 2D utilisant Javascript.</dd> + <dd>JavaScript est le langage de programmation utilisé pour ajouter de l'interactivité à un site web.</dd> + <dt><a href="/fr/docs/Web/HTTP">HTTP</a></dt> + <dd><i>HyperText Transfer Protocol</i> est le protocole utilisé entre le navigateur et les serveurs web.</dd> <dt><a href="/fr/docs/Web/SVG">SVG</a></dt> - <dd><strong>Scalable Vector Graphics<em> </em>(SVG)</strong> permettent de décrire des images comme des ensembles de vecteurs et de formes afin de pouvoir changer leur taille librement sans pixellisation. Un des avantages du format SVG est qu'il est possible de redimensionner un dessin à l'infini, sans perdre aucun détail.</dd> - <dt><a href="/fr/docs/Web/WebGL">WebGL</a></dt> - <dd><strong>WebGL </strong>apporte des<strong> graphismes 3D sur le Web</strong> grâce à une API respectant OpenGL ES 2.0 et pouvant être utilisée sur les éléments HTML {{HTMLElement("canvas")}}.</dd> -</dl> - -<h3 id="Audio_vidéo_multimédia">Audio, vidéo, multimédia</h3> - -<dl> - <dt><a href="/fr/docs/Web/Media">Les technologies média Web</a></dt> - <dd>Une <strong>liste d'API</strong> avec des liens vers leurs documentations respectives.</dd> -</dl> - -<dl> - <dt><a href="/fr/docs/Web/Media/Overview">Aperçu des technologies multi-média du web</a></dt> - <dd>Un <strong>aperçu général</strong> des technologies Web ouvertes et des API qui prennent en charge la lecture, la manipulation et l’enregistrement audio et vidéo. Si vous ne savez pas quelle API vous devez utiliser, c'est ici que vous devez commencer.</dd> -</dl> - -<dl> - <dt><a href="/fr/docs/Web/API/Media_Streams_API">Les API de capture et de diffusion multimédia</a></dt> - <dd>Une liste qui référence l'ensemble des API qui permettent de diffuser, enregistrer et modifier des flux médias, localement et au travers d'un réseau. Elle comprend l'utilisation des caméras et micros afin d'enregistrer de la vidéo de l'audio et des images.</dd> - <dt><a href="/fr/Apprendre/HTML/Multimedia_and_embedding/Contenu_audio_et_video">Utiliser HTML5 audio et video</a></dt> - <dd><strong>Intégrer</strong> de la <strong>vidéo </strong>et / ou de l'<strong>audio </strong>dans une page Web et contrôler leur lecture.</dd> - <dt><a href="/fr/docs/Web/API/WebRTC_API">WebRTC</a></dt> - <dd>Le <strong>RTC</strong> dans <strong>WebRTC </strong>signifie <strong>Real-Time Communications</strong>, une technologie qui permet le streaming audio / vidéo et le partage de données entre les clients du navigateur (pairs/peers).</dd> -</dl> - -<h3 id="Autres">Autres</h3> - -<dl> + <dd><i>Scalable Vector Graphics</i> est un format qui permet de décrire des images comme ensembles de vecteurs et de formes afin de pouvoir les mettre à l'échelle quelles que soient les dimensions selon lesquelles elles sont dessinées.</dd> <dt><a href="/fr/docs/Web/MathML">MathML</a></dt> - <dd><strong>Mathematical Markup Language</strong> (langage de balisage mathématique) rend possible l'affichage d'équations mathématiques complexes.</dd> -</dl> -</div> - -<div class="section"> -<h2 class="Documentation" id="Apprendre">Apprendre</h2> - -<dl> - <dt><a href="/fr/Apprendre">Apprendre le développement web</a></dt> - <dd>Cet ensemble d'articles couvre tout ce qu'il est nécessaire de savoir pour commencer à développer des sites web simples.</dd> - <dt><a href="/fr/Apps/Progressive">Applications Web Progressives</a></dt> - <dd>Les <strong>applications Web progressistes</strong> utilisent des API Web modernes ainsi qu'une stratégie d'amélioration progressive traditionnelle pour créer des applications Web multiplateformes. Ces applications fonctionnent partout et offrent plusieurs fonctionnalités qui leur offrent les mêmes avantages que les applications natives. Cet ensemble de documents et de guides vous dit tout ce que vous devez savoir sur les PWA.</dd> -</dl> - -<h3 id="Autres_sujets">Autres sujets</h3> - -<dl> - <dt><a href="/fr/Apps">Développer des applications web</a></dt> - <dd>Documentation pour développeurs d'applications web. Les applications web sont écrites une fois et déployées partout : sur mobile et ordinateurs.</dd> - <dt><a href="/fr/docs/Accessibilité">Accessibilité</a></dt> - <dd>L’accessibilité, en développement web, signifie faire en sorte qu’un maximum de personnes, même celles présentant des handicaps, puissent visiter des sites web. Cette section fournit des informations sur la manière de rendre le contenu accessible.</dd> - <dt><a href="/fr/docs/Web/Localization">Localisation (L10n) et Internationalisation (I18n)</a></dt> - <dd>Le web a une communauté mondiale ! Faites en sorte que votre site ou application en fasse partie en gardant à l'esprit de diffuser le contenu et son organisation dans la langue de vos utilisateurs.</dd> - <dt><a href="/fr/docs/Web/Security">Sécurité</a></dt> - <dd>Les techniques pour assurer la sécurité de votre site web ou application.</dd> - <dt><a href="/fr/docs/WebAssembly">WebAssembly</a></dt> - <dd><strong>WebAssembly </strong>est un nouveau type de code qui peut être exécuté dans les navigateurs Web modernes. Il s'agit d'un langage de type bas niveau avec un format binaire compact qui fonctionne avec des performances quasi natives et fournit des langages tels que C / C ++ avec une cible de compilation afin qu'ils puissent fonctionner sur le web. Il est également conçu pour fonctionner avec JavaScript, permettant aux deux de travailler ensemble.</dd> -</dl> - -<p><span class="alllinks"><a href="/fr/docs/tag/Web">Voir tout…</a></span></p> -</div> -</div> + <dd><i>Mathematical Markup Language</i> est un langage qui permet d'afficher des expressions mathématiques complexes.</dd> +</dl>
\ No newline at end of file diff --git a/files/fr/web/javascript/reference/operators/destructuring_assignment/index.html b/files/fr/web/javascript/reference/operators/destructuring_assignment/index.html index 3cde0fef57..45e0cd77af 100644 --- a/files/fr/web/javascript/reference/operators/destructuring_assignment/index.html +++ b/files/fr/web/javascript/reference/operators/destructuring_assignment/index.html @@ -2,8 +2,13 @@ title: Affecter par décomposition slug: Web/JavaScript/Reference/Operators/Destructuring_assignment tags: + - Destructuration + - Affectation de déstructuration - ECMAScript 2015 + - ES6 - JavaScript + - Caractéristiques de la langue + - Déstructuration des objets imbriqués et des tableaux - Opérateur - Reference translation_of: Web/JavaScript/Reference/Operators/Destructuring_assignment @@ -225,7 +230,7 @@ console.log(truc); // true</pre> <p>Une variable peut recevoir une valeur par défaut lors de la décomposition si la propriété correspondante de l'objet vaut <code>undefined</code>.</p> -<pre class="brush: js">const {a = 10; b = 5} = {a: 3}; +<pre class="brush: js">const {a = 10, b = 5} = {a: 3}; console.log(a); // 3 console.log(b); // 5</pre> |