Bootstrap Images


Advertisements


This chapter covers the Bootstrap support for images. Bootstrap provides three classes that can be used to apply some simple styles to images:

  • .img-rounded : adds border-radius:6px to give the image rounded corners.

  • .img-circle : makes the entire image round by adding border-radius:500px.

  • .img-thumbnail : adds a bit of padding and a gray border:

The following example demonstrates this:

<img src="/bootstrap/images/download.png" 
   class="img-rounded">
<img src="/bootstrap/images/download.png" 
   class="img-circle">
<img src="/bootstrap/images/download.png" 
   class="img-thumbnail">
Image Demo

Advertisements