Чтобы создать карту Bootstrap с изображением, вы можете использовать различные методы. Вот несколько вариантов:
Метод 1. Использование классов Bootstrap непосредственно в HTML:
<div class="card">
<img src="path/to/image.jpg" class="card-img-top" alt="Image Alt Text">
<div class="card-body">
<h5 class="card-title">Card Title</h5>
<p class="card-text">Card description or content goes here.</p>
</div>
</div>
Метод 2. Использование компонентов Bootstrap с классами в HTML:
<div class="card">
<img src="path/to/image.jpg" alt="Image Alt Text">
<div class="card-body">
<h5 class="card-title">Card Title</h5>
<p class="card-text">Card description or content goes here.</p>
</div>
</div>
И добавьте необходимые классы CSS, чтобы оформить карточку по своему желанию.
Метод 3. Использование классов Bootstrap с JavaScript (jQuery):
<div id="myCard" class="card">
<div class="card-body">
<h5 class="card-title">Card Title</h5>
<p class="card-text">Card description or content goes here.</p>
</div>
</div>
<script>
$(document).ready(function() {
$('#myCard').prepend('<img src="path/to/image.jpg" class="card-img-top" alt="Image Alt Text">');
});
</script>
Обратите внимание, что для метода 3 вам необходимо включить библиотеки Bootstrap и jQuery в ваш HTML-файл.