Czym jest background-image w CSS?
background-image to właściwość CSS służąca do ustawiania obrazu jako tła elementu HTML. Obraz nie jest wtedy osobnym elementem strony, lecz tłem np. nagłówka, sekcji, przycisku lub całego dokumentu.
Poprawna składnia
Najczęściej używa się funkcji url():
selektor {
background-image: url(kolo.png);
}
Wartość kolo.png oznacza ścieżkę do pliku graficznego. Może to być ścieżka względna, bezwzględna albo pełny adres URL.
Typowy błąd
Niepoprawny zapis:
background-image: kolo.png;
Brakuje tutaj funkcji url(), dlatego przeglądarka nie potraktuje tej wartości jako poprawnego obrazu tła.
CSS a HTML
Właściwość background-image należy do CSS. Nie zapisuje się w niej atrybutów HTML takich jak src, alt, height czy width. Takie atrybuty stosuje się przy znaczniku <img>:
<img src="kolo.png" alt="koło">
W egzaminie
Jeśli pytanie dotyczy ustawienia obrazka jako tła, szukaj deklaracji CSS z zapisem:
background-image: url(nazwa-pliku);
Sam obraz tła może być dodatkowo powtarzany, skalowany lub pozycjonowany innymi właściwościami CSS.