Как центрировать текст с помощью CSS?

Для того чтобы разместить текст по центру при помощи CSS, можно использовать несколько подходов.

1. С помощью свойства text-align:

Этот подход подходит для центрирования текста внутри блока.

HTML код:

  
Текст по центру

CSS код:

.text-center {
  text-align: center;
}

2. С помощью свойств margin и display:

Этот метод подходит для размещения блока с текстом по центру страницы.

HTML код:

  

    
Текст по центру
  

CSS код:

.container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;  
}
.text-block {
  margin: auto;
}

3. С помощью свойства line-height:

Этот метод подходит для центрирования текста внутри блока.

HTML код:

  
Текст по центру

CSS код:

.text-center {
  text-align: center;
  line-height: 100px; /* высота блока */
  height: 100px; /* высота блока */
}

Это не все подходы, но данная информация должна помочь вам разместить текст по центру вашего блока или страницы.