figure

[xgqfrms]

figure

[xgqfrms]

file:///Users/xgqfrms-mbp/Desktop/CSS%20%E6%8F%AD%E7%A7%98.pdf

[xgqfrms]

<figure>
  <img src="image.jpg" alt="The Image">
  <figcaption>A Caption</figcaption>
</figure>

https://www.pluralsight.com/blog/creative-professional/whats-difference-image-figure-tags-html5

http://html5doctor.com/the-figure-figcaption-elements/

https://stackoverflow.com/questions/12899691/use-of-picture-inside-figure-element-in-html5

[xgqfrms]

picture & image srcset

https://github.com/xgqfrms/CSS3/issues/11

[xgqfrms]

<figure>
  <img
    srcset="elva-fairy-320w.jpg, elva-fairy-480w.jpg 1.5x, elva-fairy-640w.jpg 2x"
    src="elva-fairy-640w.jpg"
    alt="Elva dressed as a fairy"
  />
  <figcaption>A Caption</figcaption>
</figure>

<figure>
  <source type="image/svg+xml" srcset="pyramid.svg">
  <source type="image/webp" srcset="pyramid.webp"> 
  <img src="pyramid.png" alt="regular pyramid built from four equilateral triangles">
  <figcaption>A Caption</figcaption>
</figure>