Choose a bootstrap 5.x webcomponent ->

Bootstrap Component: Tables

Tables

A basic Bootstrap 5 table has a light padding and horizontal dividers. The .table class adds basic styling to a table. The .table-striped class adds zebra-stripes to a table. The .table-hover class adds a hover effect (grey background color) on table rows.

Live Preview

Firstname	Lastname	Email
John	Doe	john@example.com
Mary	Moe	mary@example.com

<!-- Början av en Bootstrap-tabell med striped och hover-effekt-->
<table class="table table-striped table-hover">    
    <thead>
        <tr>        
            <th>Firstname</th>        
            <th>Lastname</th>        
            <th>Email</th>
        </tr>
    </thead>   
    <tbody>   
        <tr>        
            <td>John</td>        
            <td>Doe</td>       
            <td>john@example.com</td>
        </tr>    
        <tr>        
            <td>Mary</td>        
            <td>Moe</td>       
            <td>mary@example.com</td>
        </tr>    
    </tbody>
</table>