Le tag <p> définit un paragraphe ou un paragraphe de texte. C'est un élément de bloc, donc son contenu commence toujours par une nouvelle ligne et occupe toute la largeur disponible. Les suivantes après les autres paragraphes sont réparties entre elles par le remplissage, dont la valeur peut être définie à l'aide de la propriété CSS margin. Pour déplacer une ligne dans un paragraphe, utilisez le tag <br>.

Les espaces entre le tag ouvrant <p> et son contenu sont ignorés par le navigateur. Pour définir l’indentation (ligne rouge), utilisez la propriété CSS text-indent.

Syntaxe

Les paragraphes de texte sont placés entre les tags ouvrant (<p>) et fermant (</p>) . S'il n'y a pas de tag fermant, on considère que la fin du paragraphe coïncide avec le début de l'élément de bloc suivant.

Le tag <p> ne peut pas contenir des tableaux et d’autre éléments de blocs.

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
  </head>
  <body>
    <p>C'est un paragraphe</p>
  </body>
</html>

Résultat

Un paragraphe

L’utilisation de CSS

Pour aligner le texte dans un paragraphe au lieu de l'attribut align obsolète, vous devez utiliser la propriété CSS text-align.

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style>
      div.paragraph {
        text-align: center;
      }
    </style>
  </head>
  <body>
    <h1>Titre du document</h1>
    <div class="paragraph">
      <p>L'alignement de texte au centre est défini par la propriété CSS text-align</p>
    </div>
  </body>
</html>

Résultat

Text-align

Attributs

Attribut Valeur Description
align right
left
justify
Définit l’alignement de texte.
Non supporté en HTML5

Le tag <p> supporte également les Attributs globaux et les Attributs d'événements.

Comment styler le tag HTML <p> ?

Propriétés communes pour modifier le poids visuel/emphase/taille du texte dans le tag <p>:

Coloration du texte dans le tag HTML <p>:

Styles de mise en page du texte pour la tag HTML <p>:

Autres propriétés utiles pour le tag HTML <p>:

Support de Navigateurs

chrome edge firefox safari opera

Pratiquez vos connaissances

Qu'est-ce que la balise HTML <p> est utilisée pour en HTML?
Trouvez-vous cela utile?