diff options
Diffstat (limited to 'files/fr/web/html/element/p/index.md')
| -rw-r--r-- | files/fr/web/html/element/p/index.md | 192 |
1 files changed, 103 insertions, 89 deletions
diff --git a/files/fr/web/html/element/p/index.md b/files/fr/web/html/element/p/index.md index 678b9bc74e..686f8c678a 100644 --- a/files/fr/web/html/element/p/index.md +++ b/files/fr/web/html/element/p/index.md @@ -8,127 +8,141 @@ tags: - Web translation_of: Web/HTML/Element/p --- -<div>{{HTMLRef}}</div> +{{HTMLRef}} -<p>L'élément HTML <strong><code><p></code></strong> représente un paragraphe de texte. Les paragraphes sont généralement représentés comme des blocs et séparés par un espace vertical, leur première ligne est également parfois indentée. Les paragraphes sont <a href="/fr/docs/Web/HTML/Éléments_en_bloc">des éléments blocs</a>.</p> +L'élément HTML **`<p>`** représente un paragraphe de texte. Les paragraphes sont généralement représentés comme des blocs et séparés par un espace vertical, leur première ligne est également parfois indentée. Les paragraphes sont [des éléments blocs](/fr/docs/Web/HTML/Éléments_en_bloc). -<div>{{EmbedInteractiveExample("pages/tabbed/p.html", "tabbed-standard")}}</div> +{{EmbedInteractiveExample("pages/tabbed/p.html", "tabbed-standard")}} -<p>Étant des éléments de bloc, les paragraphes se fermeront automatiquement si un autre élément de bloc est analysé avant la balise de fermeture <code></p></code> (voir Omission de balises dans le tableau qui suit).</p> +Étant des éléments de bloc, les paragraphes se fermeront automatiquement si un autre élément de bloc est analysé avant la balise de fermeture `</p>` (voir Omission de balises dans le tableau qui suit). -<div class="note"> -<p><strong>Note :</strong> Pour modifier l'espacement entre les paragraphes, il faudra utiliser la propriété CSS {{cssxref("margin")}}. <em>Il ne faut pas insérer de paragraphes vides ou d'éléments {{HTMLElement("br")}} afin de créer un espace</em>.</p> -</div> +> **Note :** Pour modifier l'espacement entre les paragraphes, il faudra utiliser la propriété CSS {{cssxref("margin")}}. _Il ne faut pas insérer de paragraphes vides ou d'éléments {{HTMLElement("br")}} afin de créer un espace_. -<h2 id="Attributs">Attributs</h2> +## Attributs -<p>Cet élément, comme les autres éléments HTML, inclut <a href="/fr/docs/Web/HTML/Attributs_universels">les attributs universels</a>.</p> +Cet élément, comme les autres éléments HTML, inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_universels). -<div class="note"> -<p><strong>Note :</strong> L'attribut <code>align</code> pour les balises <code><p></code> est obsolète et ne doit plus être utilisé.</p> -</div> +> **Note :** L'attribut `align` pour les balises `<p>` est obsolète et ne doit plus être utilisé. -<h2 id="Exemples">Exemples</h2> +## Exemples -<h3 id="HTML">HTML</h3> +### HTML -<pre class="brush: html"><p> +```html +<p> Premier paragraphe du texte. J'aime les licornes beaucoup beaucoup beaucoup. -</p> +</p> -<p> +<p> Deuxième paragraphe du texte. Et si j'en avais une apprivoisée je serais très contente. -</p> -</pre> +</p> +``` -<h3 id="Résultat">Résultat</h3> +### Résultat -<p>{{EmbedLiveSample("Exemples","300","150")}}</p> +{{EmbedLiveSample("Exemples","300","150")}} -<h2 id="Accessibilité">Accessibilité</h2> +## Accessibilité -<p>Répartir le contenu entre différents paragraphes permet d'améliorer l'accessibilité d'une page. Les lecteurs d'écran et autres outils d'assistance fournissent des raccourcis qui permettent aux utilisateurs d'accéder rapidement au paragraphe suivant ou précédent et ainsi de naviguer plus rapidement sur la page, comme le permettent les blancs pour la navigation visuelle des autres utilisateurs.</p> +Répartir le contenu entre différents paragraphes permet d'améliorer l'accessibilité d'une page. Les lecteurs d'écran et autres outils d'assistance fournissent des raccourcis qui permettent aux utilisateurs d'accéder rapidement au paragraphe suivant ou précédent et ainsi de naviguer plus rapidement sur la page, comme le permettent les blancs pour la navigation visuelle des autres utilisateurs. -<p>L'utilisation de paragraphes vides (des éléments HTML <code><p></code> sans contenu) est problématique pour les personnes qui naviguent sur une page à l'aide d'outils d'assistance. Les lecteurs d'écran, par exemple, pourraient annoncer l'élément mais pas le contenu associé ce qui peut être frustrant ou source de confusion.</p> +L'utilisation de paragraphes vides (des éléments HTML `<p>` sans contenu) est problématique pour les personnes qui naviguent sur une page à l'aide d'outils d'assistance. Les lecteurs d'écran, par exemple, pourraient annoncer l'élément mais pas le contenu associé ce qui peut être frustrant ou source de confusion. -<p>S'il est nécessaire d'avoir un espace supplémentaire, on pourra utiliser des propriétés CSS comme {{cssxref("margin")}} pour obtenir l'effet désiré.</p> +S'il est nécessaire d'avoir un espace supplémentaire, on pourra utiliser des propriétés CSS comme {{cssxref("margin")}} pour obtenir l'effet désiré. -<pre class="brush: css">p { +```css +p { margin-bottom: 2em; // on ajoute un espace après chaque paragraphe } -</pre> +``` -<h2 id="Résumé_technique">Résumé technique</h2> +## Résumé technique <table class="properties"> - <tbody> - <tr> - <th scope="row"><a href="/fr/docs/Web/HTML/Catégorie_de_contenu">Catégories de contenu</a></th> - <td><a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_de_flux">Contenu de flux</a>, <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_tangible">contenu tangible</a>.</td> - </tr> - <tr> - <th scope="row">Contenu autorisé</th> - <td><a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_phrasé">Contenu phrasé</a>.</td> - </tr> - <tr> - <th scope="row">Omission de balises</th> - <td>La balise de début est obligatoire. La balise de fin peut être absente si l'élément {{HTMLElement("p")}} est immédiatement suivi d'un élément {{HTMLElement("address")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("blockquote")}}, {{HTMLElement("div")}}, {{HTMLElement("dl")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("footer")}}, {{HTMLElement("form")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("header")}}, {{HTMLElement("hr")}}, {{HTMLElement("menu")}}, {{HTMLElement("nav")}}, {{HTMLElement("ol")}}, {{HTMLElement("pre")}}, {{HTMLElement("section")}}, {{HTMLElement("table")}}, {{HTMLElement("ul")}} ou d'un autre élément {{HTMLElement("p")}} ou s'il n'y a plus de contenu dans l'élément parent et que l'élément parent n'est pas un élément {{HTMLElement("a")}}.</td> - </tr> - <tr> - <th scope="row">Parents autorisés</th> - <td>Tout élément qui accepte du <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_de_flux">contenu de flux</a>.</td> - </tr> - <tr> - <th scope="row">Rôles ARIA autorisés</th> - <td>Tous les rôles sont autorisés.</td> - </tr> - <tr> - <th scope="row">Interface DOM</th> - <td>{{domxref("HTMLParagraphElement")}}</td> - </tr> - </tbody> + <tbody> + <tr> + <th scope="row"> + <a href="/fr/docs/Web/HTML/Catégorie_de_contenu" + >Catégories de contenu</a + > + </th> + <td> + <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_de_flux" + >Contenu de flux</a + >, + <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_tangible" + >contenu tangible</a + >. + </td> + </tr> + <tr> + <th scope="row">Contenu autorisé</th> + <td> + <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_phrasé" + >Contenu phrasé</a + >. + </td> + </tr> + <tr> + <th scope="row">Omission de balises</th> + <td> + La balise de début est obligatoire. La balise de fin peut être absente + si l'élément {{HTMLElement("p")}} est immédiatement suivi d'un + élément {{HTMLElement("address")}}, + {{HTMLElement("article")}}, {{HTMLElement("aside")}}, + {{HTMLElement("blockquote")}}, {{HTMLElement("div")}}, + {{HTMLElement("dl")}}, {{HTMLElement("fieldset")}}, + {{HTMLElement("footer")}}, {{HTMLElement("form")}}, + {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, + {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, + {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, + {{HTMLElement("header")}}, {{HTMLElement("hr")}}, + {{HTMLElement("menu")}}, {{HTMLElement("nav")}}, + {{HTMLElement("ol")}}, {{HTMLElement("pre")}}, + {{HTMLElement("section")}}, {{HTMLElement("table")}}, + {{HTMLElement("ul")}} ou d'un autre élément + {{HTMLElement("p")}} ou s'il n'y a plus de contenu dans + l'élément parent et que l'élément parent n'est pas un élément + {{HTMLElement("a")}}. + </td> + </tr> + <tr> + <th scope="row">Parents autorisés</th> + <td> + Tout élément qui accepte du + <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_de_flux" + >contenu de flux</a + >. + </td> + </tr> + <tr> + <th scope="row">Rôles ARIA autorisés</th> + <td>Tous les rôles sont autorisés.</td> + </tr> + <tr> + <th scope="row">Interface DOM</th> + <td>{{domxref("HTMLParagraphElement")}}</td> + </tr> + </tbody> </table> -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaires</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', 'semantics.html#the-p-element', '<p>')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>Aucune modification depuis la dernière dérivation depuis la spécification W3C {{SpecName("HTML5 W3C")}}.</td> - </tr> - <tr> - <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-p-element', '<p>')}}</td> - <td>{{Spec2('HTML5 W3C')}}</td> - <td>Obsolescence de l'attribut <code>align</code>.</td> - </tr> - <tr> - <td>{{SpecName('HTML4.01', 'struct/text.html#h-9.3.1', '<p>')}}</td> - <td>{{Spec2('HTML4.01')}}</td> - <td>Définition intiale.</td> - </tr> - </tbody> -</table> +## Spécifications + +| Spécification | État | Commentaires | +| -------------------------------------------------------------------------------------------------------- | -------------------------------- | --------------------------------------------------------------------------------------------------------------- | +| {{SpecName('HTML WHATWG', 'semantics.html#the-p-element', '<p>')}} | {{Spec2('HTML WHATWG')}} | Aucune modification depuis la dernière dérivation depuis la spécification W3C {{SpecName("HTML5 W3C")}}. | +| {{SpecName('HTML5 W3C', 'grouping-content.html#the-p-element', '<p>')}} | {{Spec2('HTML5 W3C')}} | Obsolescence de l'attribut `align`. | +| {{SpecName('HTML4.01', 'struct/text.html#h-9.3.1', '<p>')}} | {{Spec2('HTML4.01')}} | Définition intiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("html.elements.p")}}</p> +{{Compat("html.elements.p")}} -<h2 id="Voir_aussi">Voir aussi</h2> +## Voir aussi -<ul> - <li>{{HTMLElement("hr")}}</li> - <li>{{HTMLElement("br")}}</li> -</ul> +- {{HTMLElement("hr")}} +- {{HTMLElement("br")}} |