diff options
author | tristantheb <tristantheb@users.noreply.github.com> | 2021-06-19 10:25:05 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-06-19 10:25:05 +0200 |
commit | a47584de1bd47788cb5aa6178fa88b31977b2a8e (patch) | |
tree | 1c153a5dd0e939a3ef819df87d6b988da950352f /files/fr/web/html/element/content | |
parent | 1b0940218952a8132ceb9e4b56792ad47e94d552 (diff) | |
download | translated-content-a47584de1bd47788cb5aa6178fa88b31977b2a8e.tar.gz translated-content-a47584de1bd47788cb5aa6178fa88b31977b2a8e.tar.bz2 translated-content-a47584de1bd47788cb5aa6178fa88b31977b2a8e.zip |
UPDATE: Update translation of the HTML elements — 🛠 Priority work area (#500)
* UPDATE: Updating pages starting with A
* FIX: Update missing KS to html anchor
* Review HTML Element a
* Review HTML Element abbr
* Review HTML Element acronym
* Review HTML Element address
* Review HTML Element applet
* Review HTML Element area
* Review HTML Element article
* Review HTML Element aside
* Review HTML Element audio
* UPDATE: Updating pages wtarting with B
* Review HTML Element b
* Review HTML Element base
* Review HTML Element basefont
* Review HTML Element bdi
* Review HTML Element bdo
* Review HTML Element big
* Review HTML Element blink
* Review HTML Element blockquote
* Review HTML Element body
* Review HTML Element br
* Review HTML Element button
* Review HTML Element button - rm HTMLRef
* Review HTML Element button - lint link
* UPDATE: Updating pages starting with C
* UPDATE: Updating pages starting with D
* UPDATE: Refresh the reference page
* UPDATE: Updating pages starting with E
* Review HTML Element canvas
* Review HTML Element caption
* Review HTML Element center
* Review HTML Element cite
* UPDATE: Updating pages starting with F
* BCD: Update all updated pages with new BCD format
* FIX: add missing bracket
* Review - HTML element - code
* Review - HTML Element - col
* Review - HTML Element - colgroup
* Review - HTML Element - content
* Review - HTML Element - data
* Review - HTML Element - datalist
* Review - HTML Element - dd
* Review - HTML Element - del
* Review - HTML Element
* Review - HTML Element - dfn
* Review - HTML Element - dialog
* Review - HTML element - dir
* Review - HTML Element div
* Review - HTML Element - dl
* Review - HTML Element - dt
* Review - HTML Element - em
* Review - HTML Element - embed
* Review - HTML Element - fieldset
* Review - HTML Element - figcaption
* Review - HTML Element - figure
* Review - HTML Element - font
* Review - HTML Element - footer
* Review - HTML Element - form
* Review - HTML Element - frame
* Review - HTML Element - frameset
* Review updates since PR start - A
* Review updates since PR start - B
* Review updates since PR start - C
* Review updates since PR start - D
* Review updates since PR start - F
Co-authored-by: julieng <julien.gattelier@gmail.com>
Diffstat (limited to 'files/fr/web/html/element/content')
-rw-r--r-- | files/fr/web/html/element/content/index.html | 123 |
1 files changed, 62 insertions, 61 deletions
diff --git a/files/fr/web/html/element/content/index.html b/files/fr/web/html/element/content/index.html index e3c3c4b46f..4997c16527 100644 --- a/files/fr/web/html/element/content/index.html +++ b/files/fr/web/html/element/content/index.html @@ -1,39 +1,76 @@ --- -title: <content> +title: '<content> : l''élément Shadow DOM d''emplacement du contenu' slug: Web/HTML/Element/content tags: - - Déprécié + - Content + - DOM + - Deprecated - Element - HTML + - HTML Web Components + - Placeholder - Reference - Web + - Web Components + - shadow dom translation_of: Web/HTML/Element/content +browser-compat: html.elements.content --- -<div>{{Deprecated_header}}{{HTMLRef}}</div> +<div>{{HTMLRef}}</div> -<p>L'élément HTML <strong><code><content></code></strong> était utilisé au sein d'un <em><a href="/fr/docs/Web/Web_Components/Shadow_DOM">shadow DOM</a></em> comme point d'insertion. Cet élément est désormais obsolète et n'était pas conçu pour être utilisé dans un document HTML simple mais pour être employé dans <a href="/fr/docs/Web/Web_Components">des composants web</a>. Il est désormais remplacé par l'élément <code><strong><slot></strong></code> qui permet de créer un point d'insertion pour un <em>shadow DOM</em> au sein du DOM.</p> - -<div class="note"> -<p><strong>Note : </strong>Bien que cet élément soit présent dans les premiers brouillons ded la spécification et implémenté dans plusieurs navigateurs, il a été retiré des dernières versions de la spécification et ne doit pas être utilisé. Cet élément est documenté afin d'aider à la migration.</p> +<div class="notecard deprecated"> + <p><strong>Déprécié</strong></p> + <p>Cette fonctionnalité a été supprimée des standards du Web. Bien que quelques navigateurs puissent encore la supporter, elle est en cours d'éradication. Ne l'utilisez ni dans d'anciens projets, ni dans de nouveaux. Les pages et applications Web l'utilisant peuvent cesser de fonctionner à tout moment.</p> </div> -<h2 id="Attributes">Attributes</h2> +<p class="summary">L'élément HTML <strong><code><content></code></strong> — une partie obsolète de la suite de technologies <a href="/fr/docs/Web/Web_Components">Web Components</a> — était utilisé à l'intérieur de <a href="/fr/docs/Web/Web_Components/Using_shadow_DOM">Shadow DOM</a> comme un point d'insertion, et n'était pas destiné à être utilisé dans du HTML ordinaire. Il a maintenant été remplacé par l'élément <a href="/fr/docs/Web/HTML/Element/slot"><code><slot></code></a>, qui crée un point dans le DOM où un Shadow DOM peut être inséré.</p> -<p>Comme pour tous les éléments, on peut utiliser <a href="/fr/docs/Web/HTML/Attributs_universels">les attributs universels</a> sur <code><content></code>.</p> +<div class="notecard note"> + <p><b>Note :</b></p> + <p>Bien que présent dans les premières versions des spécifications et mis en œuvre dans plusieurs navigateurs, cet élément a été supprimé dans les versions ultérieures de la spécification, et ne doit pas être utilisé. Il est documenté ici pour aider à adapter le code écrit à l'époque où il était inclus dans la spécification afin qu'il fonctionne avec les versions plus récentes de la spécification.</p> +</div> + +<table class="properties"> + <tbody> + <tr> + <th scope="row"><a href="/fr/docs/Web/Guide/HTML/Content_categories">Catégories de contenu</a></th> + <td><a href="/fr/docs/Web/Guide/HTML/Content_categories#transparent_content_model">Contenu transparent</a>.</td> + </tr> + <tr> + <th scope="row">Contenu autorisé</th> + <td><a href="/fr/docs/Web/Guide/HTML/Content_categories#flow_content">Contenu de flux</a>.</td> + </tr> + <tr> + <th scope="row">Omission de balises</th> + <td> Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires.</td> + </tr> + <tr> + <th scope="row">Parents autorisés</th> + <td>Tout élément qui accepte du contenu de flux.</td> + </tr> + <tr> + <th scope="row">Interface DOM</th> + <td><a href="/fr/docs/Web/API/HTMLContentElement"><code>HTMLContentElement</code></a></td> + </tr> + </tbody> + </table> + +<h2 id="attributes">Attributs</h2> + +<p>Comme pour tous les éléments, on peut utiliser <a href="/fr/docs/Web/HTML/Global_attributes">les attributs universels</a> sur <code><content></code>.</p> <dl> - <dt><code>select</code></dt> - <dd>Une liste de sélecteurs séparés par des virgules. La syntaxe utilisée est la même que celle utilisée pour les sélecteurs CSS. Ils permettent de sélectionner le contenu à insérer à la place de l'élément <code><content></code>.</dd> + <dt><code id="attr-select">select</code></dt> + <dd>Une liste de sélecteurs séparés par des virgules. La syntaxe utilisée est la même que celle utilisée pour les sélecteurs CSS. Ils permettent de sélectionner le contenu à insérer à la place de l'élément <code><content></code>.</dd> </dl> -<h2 id="Exemples">Exemples</h2> +<h2 id="example">Exemple</h2> <p>Voici un exemple simple d'utilisation de l'élément <code><content></code>. Il s'agit d'un fichier HTML It is an HTML file with everything needed in it.</p> -<h3 id="HTML">HTML</h3> - -<div class="note"> -<p><strong>Note :</strong> Pour que ce code fonctionne, le navigateur utilisé doit prendre en charge les composants web (voir par exemple <a href="/fr/docs/Web/Web_Components#Activer_les_Web_Components_dans_Firefox">l'activation des composants web dans Firefox</a>).</p> +<div class="notecard note"> + <p><b>Note :</b></p> + <p>Pour que ce code fonctionne, le navigateur utilisé doit prendre en charge les composants web (voir par exemple <a href="/fr/docs/Web/Web_Components#enabling_web_components_in_firefox">l'activation des composants web dans Firefox</a>).</p> </div> <pre class="brush: html"><html> @@ -60,57 +97,21 @@ translation_of: Web/HTML/Element/content </html> </pre> -<h3 id="Résultat">Résultat</h3> +<p>Si vous l'affichez dans un navigateur web, il devrait ressembler à ce qui suit.</p> -<p>{{EmbedLiveSample("Exemples","200","130")}}</p> +<p><img alt="Contenu de l'exemple" src="content-example.png"></p> -<h3 id="Capture">Capture</h3> - -<p><img alt="Contenu de l'exemple" src="https://mdn.mozillademos.org/files/10325/Capture.JPG" style="height: 193px; width: 464px;"></p> - -<h2 id="Résumé_technique">Résumé technique</h2> - -<table class="properties"> - <tbody> - <tr> - <th scope="row"><a href="/fr/docs/Web/HTML/Catégorie_de_contenu" title="HTML/Content_categories">Catégories de contenu</a></th> - <td><a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Modèle_de_contenu_transparent" title="HTML/Content_categories#Transparent_content_model">Contenu transparent</a>.</td> - </tr> - <tr> - <th scope="row">Contenu autorisé</th> - <td><a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_de_flux">Contenu de flux</a>.</td> - </tr> - <tr> - <th scope="row">Omission de balises</th> - <td>{{no_tag_omission}}</td> - </tr> - <tr> - <th scope="row">Parents autorisés</th> - <td>Tout élément qui accepte du contenu de flux.</td> - </tr> - <tr> - <th scope="row">Interface DOM</th> - <td>{{domxref("HTMLContentElement")}}</td> - </tr> - </tbody> -</table> - -<h2 id="Spécifications">Spécifications</h2> +<h2 id="specifications">Spécifications</h2> <p>Ce document ne fait plus partie d'aucune spécification.</p> -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> +<h2 id="browser_compatibility">Compatibilité des navigateurs</h2> -<p>{{Compat("html.elements.content")}}</p> +<p>{{Compat}}</p> -<h2 id="Voir_aussi">Voir aussi</h2> +<h2 id="see_also">Voir aussi</h2> <ul> - <li><a href="/fr/docs/Web/Web_Components">Les composants web</a></li> - <li>{{HTMLElement("shadow")}}</li> - <li>{{HTMLElement("template")}}</li> - <li>{{HTMLElement("slot")}}</li> - <li>{{HTMLElement("element")}}</li> -</ul> + <li><a href="/fr/docs/Web/Web_Components">Web Components</a></li> + <li>Les éléments <a href="/fr/docs/Web/HTML/Element/Shadow"><code><shadow></code></a>, <a href="/fr/docs/Web/HTML/Element/slot"><code><slot></code></a>, <a href="/fr/docs/Web/HTML/Element/template"><code><template></code></a></li> + </ul> |