[CSS]Proprietatea Backround

[R3ALL]

Background

Proprietatile CSS background sunt:
background-color
background-image
background-repeat
background-attachment
background-position
Background-color

Seteaza culoarea de background a elementului respectiv. Culoarea poate fi specificata fie prin nume, fie prin codul hexa. Exemplu:

Cod:

p {background-color: #fff}

Background-image

Seteaza imaginea de background. Exemplu:

Cod:

p {background-image: url('/img/background.png')}

Background-repeat

Se foloseste impreuna cu background-image pentru a specifica modul de repetitie al imaginii de background. Valorile valide sunt : repeat-x, repeat-y, no-repeat, repeat. Exemplu:

Cod:

p {background-image: url('/img/background.png')}
    p {background-repeat: no-repeat}

Observatie: By default, aceasta proprietate are valoarea repeat.
Background-position

Seteaza pozitionarea imaginii de background.

Valorea poate fi : left top, left center, left bottom, right top, right center, right bottom, center top, center center, center bottom sau perechi xpos, ypos:

Cod:

p {background-image: url('/img/background.png')}
    p {background-position: left top}

background-attachment

Se foloseste pentru a specifica daca background-ul este fix sau face scroll odata cu pagina. Proprietatea default este fixed.

Cod:

p {background-image: url('/img/background.png')}
    p {background-attachment: scroll}

Exista si o modalitate scurta de a scrie aceste proprietati sub forma:

Cod:

p {background: #fff url('/img/background.png') no-repeat left top}