CSS - jak zvýraznit barvu textu nad background-image (obrázkem)

Ahoj, mám v záhlaví webu s Bootstrap 4 CSS nadpis (caption) a pod ním jumbotron s carouselem s měnícím se obrázkovým pozadím a bojuji s tím, že nevím jak ten H1 nadpis barevně zvýraznit, aby nezanikal. Poradíte někdo?

ODPOVĚĎ

Ahoj,

proti obrázkovému pozadí se mi v CSS osvědčilo používat bílé písmo s černým ohraničením takto:

.text-contrast {
text-shadow: -1px 0 black, 0 1px black,
1px 0 black, 0 -1px black
}

Pak můžeš ještě zvážit jako alternativu mix-blend-mode: difference, ale ten text-contrast funguje dobře...