logo

Kako dodati pozadinsku sliku u CSS?

The pozadinska slika Svojstvo u CSS-u koristi se za postavljanje slike kao pozadine elementa. Pomoću ovog CSS svojstva možemo postaviti jednu ili više pozadinskih slika za element.

Prema zadanim postavkama, slika se nalazi u gornjem lijevom kutu elementa i ponavlja se vodoravno i okomito. Pozadinsku sliku treba odabrati prema boji teksta. Loša kombinacija teksta i pozadinske slike može biti uzrok loše dizajnirane i nečitljive web stranice.

The url() vrijednost ovog svojstva omogućuje nam uključivanje putanje datoteke do bilo koje slike. Prikazat će pozadinu elementa. Za pozadinu možemo koristiti više slika ili mješavinu gradijenata i slika. Ako se pozadinska slika ne može učitati ili ako koristimo gradijente, ali oni nisu podržani u odgovarajućem pregledniku, tada možemo upotrijebiti zamjensku vrijednost (vrijednost koja se koristi kao zamjena) kao boju pozadine elementa.

niz bajtova u niz

Sintaksa

 background-image: url(); 

Vrijednosti

url(): To je URL do slike. URL-ove možemo odvojiti zarezom ako želimo navesti više od jedne slike.

razlika između tigra i lava

Primjer

 body { background-image: url('cat.webp'); background-color: lightgray; } 
Testirajte sada

Izlaz

Kako dodati pozadinsku sliku u CSS

Primjer

 body { height: 200px; background-color: #cccccc; background-image: radial-gradient(red, green, yellow); } 
Testirajte sada

Izlaz

Kako dodati pozadinsku sliku u CSS

Primjer

 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'); } 
Testirajte sada

Izlaz

Kako dodati pozadinsku sliku u CSS