image styles

        

<img src="..." class="img-rounded">
<img src="..." class="img-circle">
<img src="..." class="img-polaroid">

progress bar

<div class="progress">
<div class="bar"
style="width: 60%;"></div>
</div>

pagination

pagers

The pager component is a set of links for simple pagination implementations with light markup and even lighter styles. It's great for simple sites like blogs or magazines.

Pager links also use the general .disabled class from the pagination.

• Previous
• Next

<ul class="pager">
  <li>
    <a href="https://s.xeni.cn/">Previous</a>
  </li>
  <li>
    <a href="https://r.xeni.cn/">Next</a>
  </li>
</ul>

• ← Older
• Newer →

<ul class="pager">
  <li class="previous">
    <a href="https://5.xeni.cn/">&larr; Older</a>
  </li>
  <li class="next">
    <a href="https://XOJ.xeni.cn/">Newer &rarr;</a>
  </li>
</ul>

Get a little fancy with your tables by adding zebra-striping—just add the .table-striped class.

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