Basic Table
Basic Bootstrap table with.table class
| # | Name | Role | Status | |
|---|---|---|---|---|
| 1 | John Doe | john@example.com | Administrator | Active |
| 2 | Jane Smith | jane@example.com | Editor | Active |
| 3 | Bob Johnson | bob@example.com | Author | Pending |
| 4 | Alice Brown | alice@example.com | Subscriber | Inactive |
Striped Table
Use.table-striped to add zebra-striping
| ID | Product | Category | Price | Stock |
|---|---|---|---|---|
| 1001 | Laptop Pro | Electronics | $1,299.00 | 23 |
| 1002 | Wireless Mouse | Accessories | $29.99 | 145 |
| 1003 | USB-C Hub | Accessories | $49.99 | 87 |
| 1004 | Monitor 27" | Electronics | $399.00 | 12 |
Bordered Table
Add borders with.table-bordered
| Order | Customer | Date | Total | Payment |
|---|---|---|---|---|
| #10234 | Sarah Connor | Oct 15, 2025 | $234.50 | Paid |
| #10235 | Mike Wilson | Oct 16, 2025 | $189.00 | Pending |
| #10236 | Emma Davis | Oct 17, 2025 | $456.75 | Paid |
Hoverable Rows
Enable hover state with.table-hover
| Task ID | Task | Assigned To | Priority | Due Date |
|---|---|---|---|---|
| T-001 | Update Dashboard UI | John Doe | High | Oct 20, 2025 |
| T-002 | Fix Login Bug | Jane Smith | Medium | Oct 22, 2025 |
| T-003 | Add Export Feature | Bob Johnson | Low | Oct 25, 2025 |
| T-004 | Security Audit | Alice Brown | High | Oct 18, 2025 |
Small Table
Make tables more compact with.table-sm
| # | Country | Capital | Population | Area (km²) |
|---|---|---|---|---|
| 1 | United States | Washington D.C. | 331.9M | 9,833,520 |
| 2 | Canada | Ottawa | 38.2M | 9,984,670 |
| 3 | Mexico | Mexico City | 128.9M | 1,964,375 |
| 4 | Brazil | Brasília | 214.3M | 8,515,767 |
| 5 | Argentina | Buenos Aires | 45.8M | 2,780,400 |
Table Variants
Contextual classes to color tables, rows, or cells| Class | Heading | Heading |
|---|---|---|
| Default | Cell | Cell |
| Primary | Cell | Cell |
| Secondary | Cell | Cell |
| Success | Cell | Cell |
| Danger | Cell | Cell |
| Warning | Cell | Cell |
| Info | Cell | Cell |
| Light | Cell | Cell |
| Dark | Cell | Cell |
Responsive Table
Wrap table in.table-responsive for horizontal scrolling
| Invoice | Client | Company | Phone | Address | Amount | Status | Actions | |
|---|---|---|---|---|---|---|---|---|
| INV-001 | Michael Scott | Dunder Mifflin | mscott@dundermifflin.com | (570) 555-0123 | 1725 Slough Avenue, Scranton, PA | $2,450.00 | Paid | |
| INV-002 | Jim Halpert | Athlead | jhalpert@athlead.com | (215) 555-0199 | 123 Market Street, Philadelphia, PA | $1,850.00 | Pending | |
| INV-003 | Pam Beesly | Pratt Institute | pbeesly@pratt.edu | (718) 555-0144 | 200 Willoughby Ave, Brooklyn, NY | $3,200.00 | Paid |
Table with Actions
Example with action buttons and checkboxes|
|
User | Role | Joined | Status | Actions | |
|---|---|---|---|---|---|---|
|
|
|
david@example.com | Admin | Jan 15, 2025 | Active |
|
|
|
|
lisa@example.com | Editor | Feb 20, 2025 | Active |
|
|
|
|
robert@example.com | User | Mar 10, 2025 | Pending |
|