Przykład
Ustaw obraz tła dla <body> element:
body
{
background-image: url("paper.gif");
background-color: #cccccc;
}
Spróbuj sam " Więcej "Try it Yourself" przykłady poniżej.
Definicja i Wykorzystanie
Właściwość background-image ustawia jeden lub więcej obrazów tła dla elementu.
Tło elementu jest całkowita wielkość elementu, w tym wypełnianie i brzeg (but not the margin) .
Domyślnie background-image jest umieszczony w lewym górnym rogu elementu, a powtarzane zarówno pionowo jak i poziomo.
Tip: Zawsze ustawić background-color który ma być używany, jeśli obraz jest niedostępny.
Domyślna wartość: | none |
---|---|
Dziedziczny: | no |
Animatable: | no. Read about animatable |
Wersja: | CSS1 + new values in CSS3 |
Składnia JavaScript: | object .style.backgroundImage="url(smiley.gif)" Try it |
Pomoc Browser
Liczby w tabeli określ pierwszą wersję przeglądarki, która w pełni obsługuje właściwość.
Nieruchomość | |||||
---|---|---|---|---|---|
background-image | 1,0 | 4,0 | 1,0 | 1,0 | 3,5 |
Note: IE8, a wcześniej nie obsługuje wielu obrazów tła na jednym elemencie.
Składnia CSS
background-image:url|none|initial|inherit;
wartości nieruchomości
Wartość | Opis |
---|---|
url(' URL ') | Adres URL do obrazu. Aby określić więcej niż jeden obraz, oddziel adresy przecinkami |
none | Nie będzie wyświetlany obraz tła. Jest to domyślny |
initial | Ustawia tę właściwość na wartość domyślną. Przeczytaj o początkowej |
inherit | Dziedziczy nieruchomość od swojego rodzica. Przeczytaj o dziedziczą |
Więcej przykładów
Przykład
Ustaw wielu obrazów tła dla <body> element:
body {
background-image: url("img_tree.gif"),
url("img_flwr.gif");
background-color: #cccccc;
}
Spróbuj sam " Podobne strony
Kurs CSS: CSS Tło
Tutorial CSS3: CSS3 Tła
HTML DOM referencyjny: backgroundImage property