Un saut de ligne peut être ajouté aux éléments HTML sans avoir à utiliser un retour de rupture
à l’aide de pseudo-éléments. Les pseudo-éléments sont utilisés pour modéliser une partie spécifique d’un élément. Ici, nous utiliserons:: after pour styliser un élément HTML afin d’ajouter un saut de ligne.
Dans le code ci-dessus, on utilise le pseudo-élément :: après
sur chaque élément inline (représenté par le span) pour ajouter un retour chariot (représenté par "a") après que la ligne de texte de la travée. Le :: après
dans ce cas a une propriété content et une propriété whitespace disponibles pour utilisation.
Le "contenu" La propriété décrit les choses que nous voulons injecter dans la durée. La propriété d’espace blanc nous dit si nous devons préserver l’espace blanc. Laisser cette propriété particulière désactivée n’interfère pas avec la fonction de verrouillage en ligne de la travée. Nous devons donc ajouter cette propriété particulière pour la remplacer.
Au fur et à mesure que vous jouez de plus en plus avec le style et la mise en page, vous constaterez probablement que la solution ci-dessus n’est pas nécessairement la meilleure solution. Si vous ajoutez un rembourrage de quelque nature que ce soit ainsi que l’arrière-plan, vous verrez que ces propriétés CSS ont tendance à estomper là o√π l’arrière-plan entre en jeu. Voir l’exemple de code ci - dessous qui illustre le point:
Professeur Dumbledore
Professeur McGonagall
Professeur Rogue
professeur Trelawney