Comment puis-je étirer le texte horizontalement pour remplir la largeur d'un Div ?

Étirer le texte horizontalement pour l'adapter à la largeur d'un div

Dans le développement Web, il est souvent souhaitable que le texte s'agrandisse horizontalement pour remplir un div d'un domaine spécifique. largeur. Cependant, par défaut, le texte ne s'étirera pas pour occuper l'espace supplémentaire.

Solution : justification du texte et élément en ligne

Pour obtenir cet effet, nous pouvons utiliser du texte CSS -align:justify avec un hack mineur :

div {
  background-color: gold;
  text-align: justify;
}

span {
  background-color: red;
  width: 100%;
  height: 1em;
  display: inline-block;
}

<div>
  Lorem ipsum sit dolor
  <span> </span>
</div>

En justifiant le texte dans le div et en ajoutant un élément span vide avec une largeur couvrant tout le div, nous forçons le texte à s'étirer horizontalement pour remplir l'espace disponible.

Cette technique garantit que le texte remplit toujours parfaitement le div, quelle que soit sa longueur, créant une mise en page visuellement attrayante.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!