Hoe kan ik tekst centreren (horizontaal en verticaal) in een div

Uitgang

Stap 2: Toegang tot div Container om tekst te centreren

Ga nu naar de div-container met behulp van de ' ID kaart ” attribuutnaam met selector “ # ” en pas de volgende CSS-eigenschappen toe:

Hier:

• • “ breedte ” eigenschap wordt gebruikt voor het instellen van de breedte van de container.
  • “ marge ” specificeert een lege ruimte buiten de container.
  • “ opvulling ” definieert een spatie binnen de grens van het element.
  • “ achtergrond ” stelt de achtergrondkleur in aan de achterkant van het element.
  • “ tekst uitlijnen ” eigenschap wordt gebruikt voor het instellen van de uitlijning van de tekst als “ centrum ”.
  • “ kleur ” specificeert een kleur voor de tekst binnen de grens.

Het kan worden waargenomen dat we met succes uitgelijnde tekst horizontaal hebben gecentreerd binnen de gemaakte div:

Hoe tekst verticaal centreren in een div?

Volg de meegeleverde instructies om tekst verticaal in een div-container te centreren.

Stap 1: Toegang tot de div-container

Open allereerst de gemaakte div-container.

Stap 2: pas CSS-eigenschappen toe om tekst verticaal te centreren

Pas vervolgens de onderstaande CSS-eigenschappen toe om tekst verticaal in een div te centreren:

Volgens het bovenstaande codefragment:

• • Stel de ' weergave ” dat het weergavegedrag van het element specificeert als “ tafel-cel ”, wat betekent dat het zich gedraagt ​​als de cel van de tabel in het div-element.
  • “ breedte ” eigenschap specificeert de breedte van het element.
  • “ hoogte ” stelt de hoogte van het element in.
  • “ opvulling ” definieert een lege ruimte binnen het element.
  • “ kleur ” wordt gebruikt om de kleur van de tekst in het element in te stellen.
  • “ Achtergrond kleur ” specificeert de kleur van de achterkant van het element.
  • “ grens ” eigenschap definieert een grens op een element.
  • “ verticaal uitlijnen ” eigenschap wordt gebruikt voor het instellen van de verticale uitlijning van een gedefinieerd element in de “ midden ”.

Uitgang

U hebt de volledige procedure geleerd om de tekst in de container op beide manieren te centreren, verticaal en horizontaal.

Conclusie

Om de tekst verticaal en horizontaal binnen een div te centreren, maakt u eerst een div-container met behulp van het