HTML-Prototype von Hochschule RheinMain

<insert-markup>2.6.8-</insert-markup>
Alternative Text

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massaLorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massaLorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa

Markup: templates/output/04-elements/images/figure-with-hover.html

<div class="figure-wrapper">
  <figure class="image">
    <picture>
      <source srcset="https://placeholder.in2code.de/1400x1050" media="(min-width:960px)"/>
      <source srcset="https://placeholder.in2code.de/1000x750" media="(min-width:768px)"/>
      <source srcset="https://placeholder.in2code.de/700x525" media="(min-width:320px)"/>
      <source srcset="https://placeholder.in2code.de/320x180" media="(min-width:0)"/><img src="https://placeholder.in2code.de/1400x1050" title="Bild Titel" alt="Alternative Text" loading="lazy" decoding="async"/>
    </picture>
    <figcaption class="image-caption-hover"><strong class="image-caption-hover__title strong" aria-hidden="true">Bild Titel</strong>
      <div class="image-caption-hover__description">
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massaLorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massaLorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa</p>
      </div>
    </figcaption>
  </figure>
</div>
Source: assets/sass/04-elements/_elements.images.scss, line 183