project 6

Every project has a beautiful feature showcase page. It’s easy to include images in a flexible 3-column grid format. Make your photos 1/3, 2/3, or full width.

To give your project a background in the portfolio page, just add the img tag to the front matter like so:

---
layout: page
title: project
description: a project with a background image
img: /assets/img/12.jpg
---

</div>

</div>

</div> </div>

Caption photos easily. On the left, a road goes through a tunnel. Middle, leaves artistically fall in a hipster photoshoot. Right, in another hipster photoshoot, a lumberjack grasps a handful of pine needles.

</div> </div>

This image can also have a caption. It's like magic.

You can also put regular text between your rows of images. Say you wanted to write a little bit about your project before you posted the rest of the images. You describe how you toiled, sweated, *bled* for your project, and then... you reveal it's glory in the next row of images.

</div>

</div> </div>

You can also have artistically styled 2/3 + 1/3 images, like these.

The code is simple. Just wrap your images with `

` and place them inside `

` (read more about the Bootstrap Grid system). To make images responsive, add `img-fluid` class to each; for rounded corners and shadows use `rounded` and `z-depth-1` classes. Here's the code for the last row of images above: ```html

{% include figure.html path="assets/img/6.jpg" title="example image" class="img-fluid rounded z-depth-1" %}

{% include figure.html path="assets/img/11.jpg" title="example image" class="img-fluid rounded z-depth-1" %}

```