Как расположить текст на картинке CSS

Для расположения текста на картинке в CSS можно использовать свойство background-image и свойство background-position.

Например, чтобы расположить текст по центру картинки, можно использовать следующий код:

.container {
  background-image: url('path/to/image.jpg');
  background-position: center center;
  text-align: center;
}

Здесь мы задали картинку в качестве фона для элемента .container и расположили ее по центру с помощью свойства background-position. Затем мы выровняли текст по центру с помощью свойства text-align.

Если нужно расположить текст в определенной части картинки, можно задать соответствующие значения для свойства background-position. Например, чтобы расположить текст в верхней левой части картинки, можно использовать следующий код:

.container {
  background-image: url('path/to/image.jpg');
  background-position: top left;
  text-align: left;
}

Здесь мы задали значение top left для свойства background-position, чтобы расположить картинку в верхней левой части, и выровняли текст по левому краю с помощью свойства text-align.

реклама

Качественный хостинг сайтов

реклама

Получите консультацию нашего маркетолога

Изучит ваш проект, подберет подходящие услуги и тарифы

Получите бесплатный аудит

Наш специалист сделает базовый аудит вашего проекта и предложит персональные предложения.

Закажите услугу Как расположить текст на картинке CSS

Наш специалист свяжется с вами в ближайшее время и уточнит детали