Uvod

Veličinu pozadinske slike možemo odrediti uz pomoć svojstva background-size. Sliku možemo napraviti kao lijevu, rastegnutu i prilagođenu raspoloživom prostoru. Postoji toliko mnogo sintaksi za implementaciju svojstva veličine pozadine. Možemo postaviti svojstvo svojstva veličine pozadine uz pomoć vrijednosti i jediničnih vrijednosti.

U jediničnim vrijednostima, možemo definirati svojstvo veličine pozadine u obliku postotaka ili piksela. Možemo ga definirati i uz pomoć globalne vrijednosti. Možemo ga implementirati uz pomoć globalne vrijednosti uz pomoć donjeg isječka.

aps c kod

 .card-hero inherit 

Shvatimo temu ukratko.

Vrijednosti ključnih riječi

Možemo koristiti ključnu riječ value uz pomoć cover i contain. Veličinu pozadine možemo promijeniti uz pomoć ovih ključnih riječi.

1. Naslovnica:

Veličinu pozadine možemo postaviti pomoću ključne riječi cover. Ako veličinu pozadine definiramo kao naslovnicu, tada će slika stati u spremnik bez ostavljanja prostora. Također će poboljšati sliku kako bi odgovarala ekranu.

Shvatimo ovo uz pomoć donjeg primjera.

Primjer 1:

stdin u c

Kodirati:

 Document body { margin: 0; padding: 0; font-family: Arial, sans-serif; background-color: #f0f0f0; } .background-container { position: relative; width: 100vw; height: 100vh; background-image: url(&apos;https://e0.pxfuel.com/wallpapers/163/906/desktop-wallpaper-beautiful-nature-with-girl-beautiful-girl-with-nature-and-moon-high-resolution-beautiful.webp&apos;); background-size: cover; background-position: center; text-align: center; color: white; } .background-container h1 { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 2.5rem; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); } <p>Where every step unveils a new wonder.</p> 

Izlaz

Obrazloženje:

U gornjem kodu, tri pozadinske slike kombinirane su pomoću svojstva background-image. Svojstvo veličine pozadine određuje veličine svake pozadinske slike: 30% širine za prvu sliku, 40% širine za drugu sliku i naslovnicu za treću sliku. Svojstvo položaja pozadine različito je postavljeno za svaku sliku kako bi se stvorila uravnotežena kompozicija.