logo

Fundal CSS

Proprietatea de fundal CSS este utilizată pentru a defini efectele de fundal asupra elementului. Există 5 proprietăți de fundal CSS care afectează elementele HTML:

  1. culoare de fundal
  2. imagine de fundal
  3. fundal-repetare
  4. atașament de fundal
  5. fundal-poziție

1) Culoare de fundal CSS

Proprietatea background-color este folosită pentru a specifica culoarea de fundal a elementului.

Puteți seta culoarea de fundal astfel:

 h2,p{ background-color: #b0d4de; } <h2>My first CSS page.</h2> <p>Hello Javatpoint. This is an example of CSS background-color.</p> 
Testează-l acum

Ieșire:

Prima mea pagină CSS.

Salut Javatpoint. Acesta este un exemplu de culoare de fundal CSS.


2) imagine de fundal CSS

Proprietatea background-image este folosită pentru a seta o imagine ca fundal al unui element. În mod implicit, imaginea acoperă întregul element. Puteți seta imaginea de fundal pentru o pagină ca aceasta.

 body { background-image: url(&apos;paper1.webp&apos;); margin-left:100px; } 
Testează-l acum

4) CSS fundal-atașament

Proprietatea background-attachment este folosită pentru a specifica dacă imaginea de fundal este fixă ​​sau pentru a derula cu restul paginii în fereastra browserului. Dacă ați fixat imaginea de fundal, atunci imaginea nu se va mișca în timpul derulării în browser. Să luăm un exemplu cu o imagine de fundal fixă.

 background: white url(&apos;bbb.webp&apos;); background-repeat: no-repeat; background-attachment: fixed; 
Testează-l acum

5) CSS fundal-poziție

Proprietatea background-position este folosită pentru a defini poziția inițială a imaginii de fundal. În mod implicit, imaginea de fundal este plasată în partea din stânga sus a paginii web.

Puteți seta următoarele poziții:

  1. centru
  2. top
  3. fund
  4. stânga
  5. dreapta
 background: white url(&apos;good-morning.webp&apos;); background-repeat: no-repeat; background-attachment: fixed; background-position: center; 
Testează-l acum