Skip to content

<img> / <video> / <audio>

All embedded media elements are responsive by default: max-width: 100% and height: auto. This ensures images, videos, canvases, iframes, and SVGs never overflow their containers.

Image

live preview
editable html
<img src="https://picsum.photos/800/400" alt="A placeholder landscape image" />

Responsive Image with Caption

live preview
editable html
<figure>
  <img src="https://picsum.photos/800/400" alt="Responsive placeholder image" />
    <figcaption>Images are responsive by default: <code>max-width: 100%</code> and <code>height: auto</code>.</figcaption>
</figure>