Czym jest background-repeat w CSS?
background-repeat to właściwość CSS określająca, czy i w jaki sposób obraz ustawiony jako tło ma być powielany w elemencie.
Stosuje się ją najczęściej razem z background-image:
naglowek {
background-image: url(kolo.png);
background-repeat: repeat-x;
}
Najważniejsze wartości
repeat– obraz powtarza się w poziomie i pionie,repeat-x– obraz powtarza się tylko w poziomie,repeat-y– obraz powtarza się tylko w pionie,no-repeat– obraz nie powtarza się.
Przykład: powielanie w poziomie
Jeżeli obraz ma utworzyć poziomy pasek lub ciąg elementów od lewej do prawej, używa się:
background-repeat: repeat-x;
Taki zapis sprawi, że grafika zostanie powielona wzdłuż osi X, czyli poziomo.
Różnica między repeat a repeat-x
background-repeat: repeat;
powieli tło zarówno w poziomie, jak i w pionie. Natomiast:
background-repeat: repeat-x;
powieli tło wyłącznie w poziomie, co odpowiada sytuacji, gdy na ekranie widać kilka kopii obrazka ułożonych w jednym rzędzie.
W egzaminie
Jeśli na ilustracji widać obraz tła powielony tylko poziomo, poprawną wartością jest repeat-x.