biofriction-wp-theme/node_modules/foundation-sites/docs/pages/thumbnail.md

1.6 KiB

title description video sass
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à! BOtW8oacFZk scss/components/_thumbnail.scss

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.