L'espacement des lettres dans un Div peut-il s'ajuster dynamiquement pour remplir sa largeur fixe ?

Ajuster l'espacement des lettres pour s'adapter à la largeur du div

Problème :

Vous avez un div avec une largeur fixe et le le texte à l’intérieur du div varie en longueur. Est-il possible d'ajuster dynamiquement l'espacement entre les lettres dans le texte pour qu'il remplisse toujours parfaitement le div, quel que soit le contenu du texte ?

Solution :

La clé pour y parvenir, il faut combiner la propriété CSS text-align et un "hack" intelligent.

CSS Code :

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

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

Code HTML :

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

Explication :

Le "texte- La propriété align: justifier" aligne le texte contre les marges gauche et droite. L'élément "span" est une superposition transparente qui étend la largeur du div (100%). En plaçant le "span" après le contenu du texte, cela force le texte à remplir l'espace restant, justifiant l'espacement entre les lettres.

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!