1. Solution home
  2. Usage Guides
  3. Formatting Content

Images

Jeffrey Davis
Modified on: Mon, 19 Mar, 2018 at 10:12 AM

By default, images don't have any borders:

<p>
  <img src="lotus.jpg" />
</p>


But if you want they can be framed:

<p>
  <img class="image-with-border" src="lotus.jpg" />
</p>


Or they can have shadow:

<p>
  <img class="image-with-shadow" src="lotus.jpg" />
</p>


Or they can even have overlay:

<p class="image-overlay">
  <img src="lotus.jpg" />
</p>


Border-radius

Image Lightbox

It's possible to open a larger version of the image in the lightbox:


<p>
  <a class="image-with-lightbox" href="lotus.jpg">
    <img src="lotus.jpg" width="400" />
  </a>
</p>


J
Jeffrey is the author of this solution article.

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.
Theme options
This widget is for demo purposes only