Objectif de l'astuce : Astuce css pour la balise <p>



La balise <p> Texte </p> permet d'écrire une ligne puis, un saut de ligne ( caractérisé par le </p>).
En réalité, la lettre p vient du mot anglais Paragraph ( paragraphe ).. Toutes lignes contenues dans cette balise est (logiquement) un "paragraphe". Pour sauter de ligne la méthode la plus simple est l'utilisation de <br/>

Pour modifier son apparence ( dans tous le site dès que <p> sera présent, dans le fichier de style .css il convient d'utiliser


p {
color:#00FFFF
}

Ici, color modifiera donc la couleur de vos lignes.
Cependant, pour changer la hauteur de ligne, c'est à dire l'espace entre celle-du dessus et celle du dessous, il suffit d'utiliser la valeur margin et padding




p {
line-height:14px;
}


14px est ici à changer par la hauteur voulue.
En exemple :



    Exemple du line-height avec valeur 14 px
    2 ème ligne
    3ème, toujours séparée par la balise <br/>

Si vous souhaitez utiliser des <p> </p> entre chaque ligne ( on oubli alors la fonction de "paragraphe" ) vous pouvez utilise la fonction css margin-bottom




p {
margin-bottom:2px; padding-bottom:2px;
}


Exemple avec <p> et margin-bottom 2px;

Exemple avec <p> et margin-bottom 2px;

Comme vous le voyez, ici la hauteur de ligne est modifiée de manière "barbare", mais c'est parfaitement fonctionnel.



Libre à chacun de choisir sa préférence pour son site

Vous pouvez naturellement modifier une ligne en particulier en utilisant la ressource <p class="votreclasse">Texte</p> , mais cela ne s'avère pas pratique du tout