Как сделать правильно SVG картинка и 2 строки текста?

Для создания SVG картинки и добавления двух строк текста в Bootstrap вам понадобится использовать несколько элементов и классов.

1. Сначала создайте контейнер для SVG и текста, используя блочный элемент, например <div>. Вы можете добавить класс Bootstrap 'container' или 'container-fluid' для определения ширины контейнера.

Пример:

<div class="container">
    <!-- место для SVG и текста -->
</div>

2. Далее, добавьте SVG картинку в контейнер. Вам нужно вставить тег <svg> и определить его атрибуты, такие как ширина, высота и цвет.

Пример:

<div class="container">
    <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
        <!-- ваша SVG картинка -->
    </svg>
</div>

3. Затем, добавьте две строки текста в контейнер. Используйте тег <p> или <span> для каждой строки текста и задайте им класс Bootstrap 'text'.

Пример:

<div class="container">
    <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
        <!-- ваша SVG картинка -->
    </svg>
    <p class="text">Первая строка текста</p>
    <p class="text">Вторая строка текста</p>
</div>

4. Наконец, чтобы правильно оформить SVG картинку и текст, вы можете применить стили из Bootstrap, такие как классы 'd-flex' или 'justify-content-center', чтобы центрировать элементы по горизонтали.

Пример:

<div class="container">
    <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" class="d-flex justify-content-center">
        <!-- ваша SVG картинка -->
    </svg>
    <p class="text d-flex justify-content-center">Первая строка текста</p>
    <p class="text d-flex justify-content-center">Вторая строка текста</p>
</div>

Таким образом, вы сможете правильно создать SVG картинку и добавить две строки текста с использованием Bootstrap классов для стилизации и оформления.