Przykład
Styl tła dokumentu:
document.body.style.background = "#f3f3f3 url('img_tree.png') no-repeat right
top"; Spróbuj sam " Więcej "Try it Yourself" przykłady poniżej.
Definicja i Wykorzystanie
Zestawy własność lub powraca do ośmiu oddzielnych właściwości tle, w skróconej formie.
Dzięki tej właściwości można ustawić / powrót jednego lub więcej z następujących czynności (w dowolnej kolejności):
- kolor tła
- zdjęcie w tle
- powtarzanie tła
- background-attachment
- background-position
- background-size
- background-origin
- background-clip
Powyższe właściwości można również ustawić z odrębnych właściwości stylu. Zastosowanie oddzielnych właściwości jest wysoce zalecane dla non-zaawansowanych autorów dla lepszej sterowności.
Wsparcie przeglądarka
Liczby w tabeli określ pierwszą wersję przeglądarki, która w pełni obsługuje właściwość.
| Nieruchomość | |||||
|---|---|---|---|---|---|
| background | 1,0 | 4.0 | 1,0 | 1,0 | 3.5 |
Uwaga: Patrz indywidualne wsparcie przeglądarki dla każdej wartości poniżej.
Składnia
Zwrotu mienia w tle:
object .style.background
Ustaw właściwość tła:
object .style.background=" wartości nieruchomości Wartość Opis color Ustawia kolor tła elementu image Ustawia obraz tła dla elementu repeat Ustawia jak obraz tła będzie powtarzany attachment Określa, czy obraz tła jest stałe lub zwoje o stronie position Ustawia pozycję wyjściową obrazu tła size Ustawia rozmiar obrazu tła origin Ustawia obszar pozycjonowania tła clip Ustawia obszar malowania obrazu tła initial Ustawia tę właściwość na wartość domyślną. Przeczytaj o początkowy inherit Dziedziczy nieruchomość od swojego rodzica. Przeczytaj o dziedziczyć
Szczegóły techniczne
Domyślna wartość: przejrzyste none repeat scroll 0% 0% auto padding-box border-box Zwracana wartość: Ciąg reprezentujący tła elementu Wersja CSS CSS1 + nowe właściwości w CSS3
Więcej przykładów
Przykład
Zmiana tła elementu DIV:
document.getElementById("myDIV").style.background = "url('smiley.gif') blue repeat-x center"; Spróbuj sam "
Przykład
Ustawić obraz tła dla dokumentu:
document.body.style.backgroundImage = "url('img_tree.png')"; Spróbuj sam "
Przykład
Ustawić obraz tła do no-repeat:
document.body.style.backgroundRepeat = "repeat-y"; Spróbuj sam "
Przykład
Ustawić obraz tła do stałej (will not scroll) :
document.body.style.backgroundAttachment = "fixed"; Spróbuj sam "
Przykład
Zmień pozycję background-image:
document.body.style.backgroundPosition = "top right"; Spróbuj sam "
Podobne strony
Kurs CSS: CSS Tło
Tutorial CSS3: CSS3 Tła
Odniesienie CSS: background property
<Style obiektu