Choose a bootstrap 5.x webcomponent ->

Bootstrap Component: Cards

Cards

A basic card is created with the .card class, and content inside the card has a .card-body .card-title .card-text classes.

Live Preview

Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere

<!-- Början av en Bootstrap-kortkomponent -->
<div class="card" style="width: 200px;">
    <!-- Bilden högst upp på kortet -->
    <img src="https://dummyjson.com/image/200x100" class="card-img-top" alt="...">
    <!-- Kortets kropp som innehåller titel, text och knapp -->
    <div class="card-body">
        <!-- Kortets titel -->
        <h5 class="card-title">Card title</h5>
        <!-- Kortets textinnehåll -->
        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        <!-- En knapp som kan länka till en annan sida -->
        <a href="#" class="btn btn-primary">Go somewhere</a>
    </div>
</div>