De hero image wordt gebruikt voor achtergronden. De achtergronden worden meestal op homepagina's gebruikt. De hero image wordt na de main ingeladen.
In de div.wrapper--hero-image onder de figure kun je content plaatsen wat je over de afbeelding wilt laten vallen. Bekijk een voorbeeld
Voorbeeld met background-image
Voorbeeld met losse afbeelding
Voorbeeld met tekst overlay
Wanneer je tekst over de afbeelding heen wilt laten vallen, moet je de extra klasse hero-image--overlay toevoegen aan de `figure. De achtergrond wordt hierdoor iets donkerder, zodat het contrast tussen tekst en achtergrond groter word en de tekst beter leesbaar is.
Tekst
Benodigde stylesheets
/uno/components/hero-image/hero.css