The obrázek na pozadí vlastnost v CSS se používá k nastavení obrázku jako pozadí prvku. Pomocí této vlastnosti CSS můžeme nastavit jeden nebo více obrázků na pozadí pro prvek.
Ve výchozím nastavení je obrázek umístěn v levém horním rohu prvku a opakuje se vodorovně i svisle. Obrázek na pozadí by měl být zvolen podle barvy textu. Špatná kombinace textu a obrázku na pozadí může být příčinou špatně navržené a nečitelné webové stránky.
The url() hodnota této vlastnosti nám umožňuje zahrnout cestu k libovolnému obrázku. Zobrazí pozadí prvku. Na pozadí můžeme použít více obrázků nebo směs přechodů a obrázků. Pokud se nepodaří načíst obrázek pozadí nebo pokud používáme přechody, ale nejsou podporovány v odpovídajícím prohlížeči, můžeme jako barvu pozadí prvku použít záložní hodnotu (hodnota použitá jako náhrada).
Sree Ramanujan
Syntax
background-image: url();
Hodnoty
url(): Je to adresa URL obrázku. Pokud chceme zadat více než jeden obrázek, můžeme adresy URL oddělit čárkou.
pružinové moduly
Příklad
body { background-image: url('cat.webp'); background-color: lightgray; }Otestujte to hned
Výstup
Příklad
body { height: 200px; background-color: #cccccc; background-image: radial-gradient(red, green, yellow); }Otestujte to hned
Výstup
Příklad
body { height: 200px; background-color: #cccccc; background-image: linear-gradient(rgba(0, 0, 255, 0.5),rgba(255, 255, 0, 0.5)), url('lion.webp'); }Otestujte to hned
Výstup