DokumentationBildformate
Bildformate im Layout
Bildunterschrift steht unter dem Bild
Dieser Bilder werden vom Redakteur ins Layout gesetzt.
3:4
<figure>
<img class="img-3x4" src="[...]" alt="[...]">
<figcaption class="text-end">[...]</figcaption>
</figure>
1:1
<figure>
<img class="img-1x1" src="[...]" alt="[...]">
<figcaption class="text-end">[...]</figcaption>
</figure>
4:3
<figure>
<img class="img-4x3" src="[...]" alt="[...]">
<figcaption class="text-end">[...]</figcaption>
</figure>
3:2
<figure>
<img class="img-3x2" src="[...]" alt="[...]">
<figcaption class="text-end">[...]</figcaption>
</figure>
16:9
<figure>
<img class="img-16x9" src="[...]" alt="[...]">
<figcaption class="text-end">[...]</figcaption>
</figure>
21:9
<figure>
<img class="img-21x9" src="[...]" alt="[...]">
<figcaption class="text-end">[...]</figcaption>
</figure>Bildformate in Widgets
Diese Darstellung findet Anwendung in Komponenten wie Headern, Teaser-Kacheln, ...
Bildunterschrift steht im Bild, um bei den komplexeren Layouts in Komponenten nicht zu stören.
3:4
<figure>
<img class="img-3x4" src="[...]" alt="[...]">
<figcaption class="caption-inside text-end">[...]</figcaption>
</figure>1:1
<figure>
<img class="img-1x1" src="[...]" alt="[...]">
<figcaption class="caption-inside text-end">[...]</figcaption>
</figure>4:3
<figure>
<img class="img-4x3" src="[...]" alt="[...]">
<figcaption class="caption-inside text-end">[...]</figcaption>
</figure>
7:6
// Diese Proportion findet aktuell nur im Hero-Header der Startseite Verwendung
<figure>
<img class="img-7x6" src="[...]" alt="[...]">
<figcaption class="caption-inside text-end">[...]</figcaption>
</figure>3:2
<figure>
<img class="img-3x2" src="[...]" alt="[...]">
<figcaption class="caption-inside text-end">[...]</figcaption>
</figure>16:9
<figure>
<img class="img-16x9" src="[...]" alt="[...]">
<figcaption class="caption-inside text-end">[...]</figcaption>
</figure>21:9
<figure>
<img class="img-21x9" src="[...]" alt="[...]">
<figcaption class="caption-inside text-end">[...]</figcaption>
</figure>