Table Styling

If you need to make tables, you have some built-in styling for you to make nice looking tables.

Default Style

This is your default table styling which allows you to customize it to your own preferences. No class is required for this table.

table default

Striped Table

This is a striped styled table where every other row is shaded. Use this class on your table:

<table class="table-striped">

table striped

Striped and Bordered Table

This is a striped and bordered table where every other row is shaded, but your table cells have borders. Use this class on your table:

<table class="table-striped-bordered">

table striped bordered

Responsive Tables

Part of using the Bootstrap front-end framework, is the fact you can make tables responsive — to a certain point. To make a table responsive, you need to add an extra class to the table tag.¬†Create responsive tables by wrapping your table with a div using the class:


This will make them scroll horizontally on small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.

Example Table

<div class="table-responsive">   <table class="table">     ...   </table> </div>