My Digital Buildings

Thumbnail

If you're going to use an image as an anchor, we've got you covered. All you gotta do is add one class to your image and voilà!

The .thumbnail class can be applied directly to an <img> element, or an <a> that wraps it. Make sure the <img> has an alt attribute that describes the contents of the image.

Watch this part in video

edit on codepen button
<img class="thumbnail" src="assets/img/thumbnail/01.jpg" alt="Photo of Uranus.">
<a href="#" class="thumbnail"><img src="assets/img/thumbnail/02.jpg" alt="Photo of Neptune."></a>
<img class="thumbnail" src="assets/img/thumbnail/03.jpg" alt="Photo of Pluto.">
Photo of Uranus.
Photo of Neptune.
Photo of Pluto.