Comment centrer le texte dans un cercle dessiné par CSS ?

Comment dessiner un cercle avec du texte au centre

Pour créer un cercle avec du texte au milieu en utilisant CSS, modifiez le code utilisé pour dessiner le cercle :

1. Définissez la hauteur de la ligne pour qu'elle corresponde à la hauteur du div. Cela force une seule ligne de texte à apparaître verticalement centrée. Dans l'exemple ci-dessous, la hauteur et la hauteur de ligne sont toutes deux définies sur 500 px.

.circle {
  width: 500px;
  height: 500px;
  line-height: 500px;
  border-radius: 50%;
  font-size: 50px;
  color: #fff;
  text-align: center;
  background: #000
}

2. Ajoutez du texte au div. Enveloppez le texte souhaité dans le champ
   élément.

<div class="circle">Hello I am A Circle</div>

Ce code créera un cercle centré avec le texte "Bonjour, je suis un cercle" positionné au milieu.

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!