Images
To create a styled image, use the uk-thumbnail class. The following are additional classes that you can use:
| Style | Description |
|---|---|
uk-thumbnail |
creates a border around the image |
uk-border-rounded |
creates an image with rounded corners |
uk-thumbnail-expand |
Makes the image fill the entire width of the parent container |
Image with thumbnail style
markup
<img class="uk-thumbnail" src="images/demo/gallery/1.jpg" alt="sample_1" width="250" height="250">
Image with rounded corners style
markup
<img class="uk-border-rounded" src="images/demo/gallery/1.jpg" alt="sample_1" width="250" height="250">
Image in circle
markup
<img class="uk-border-circle" src="images/demo/gallery/1.jpg" alt="sample_1" width="250" height="250">
Image with caption
You can use the uk-thumbnail-caption class to apply a caption under the image.
image caption
markup
<div class="uk-thumbnail"> <img src="images/demo/gallery/1.jpg" alt="sample_1" width="275" height="182"> <div class="uk-thumbnail-caption">image caption</div> </div>
You can view more examples and classes that you can use from here
