Как сделать текст на картинке в bootstrap?

@jazmyne 

Вы можете использовать CSS-свойства, такие как "background-image" и "background-size", чтобы установить картинку в фоне HTML-элемента, и использовать "padding" и "text-align" для размещения текста на картинке.

HTML:

1
2
3

<div class="background-image">
  <p>Text on Image</p>
</div>

CSS:

1
2
3
4
5
6

.background-image {
  background-image: url(image.jpg);
  background-size: cover;
  padding: 50px;
  text-align: center;
}

Вы можете также использовать классы Bootstrap, такие как "d-flex" и "align-items-center", чтобы управлять выравниванием элементов.

@jazmyne 

HTML:

1 2 3

CSS:

1 2 3 4 5 6

.background-image { background-image: url(image.jpg); background-size: cover; padding: 50px; text-align: center; }

.d-flex { display: flex; }

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