KWALIFIKACJA INF3 - CZERWIEC 2017

PYTANIE NR 6.
W przedstawionej definicji stylu CSS, powtarzanie dotyczy
Ilustracja przedstawia fragment kodu CSS, który definiuje styl dla elementu HTML 'body'.
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Powtarzanie w definicji tła CSS dotyczy obrazu ustawionego jako background, a nie elementu <img>. Wartość wskazująca powtarzanie w osi Y oznacza, że grafika tła będzie kafelkowana w pionie (góra–dół), a nie w poziomie ani automatycznie dla akapitów.

Pełne wyjaśnienie:

W CSS grafika może pojawić się na stronie na dwa zasadnicze sposoby: jako element HTML <img> (czyli część treści dokumentu) albo jako obraz tła ustawiony właściwościami tła (np. w ramach background). Pytanie dotyczy właśnie mechanizmu powtarzania tła, czyli tego, jak przeglądarka "kafelkuje" obraz ustawiony jako background.

Jeżeli w definicji stylu pojawia się ustawienie powtarzania odpowiadające osi Y (pion), oznacza to, że ten sam obraz tła będzie kopiowany jeden pod drugim: od góry do dołu. Dlatego poprawna jest odpowiedź: "rysunku umieszczonego w tle strony w pionie."

Dlaczego pozostałe odpowiedzi są niepoprawne?

  • "rysunku umieszczonego znacznikiem img." – <img> nie jest tłem. Jego "powtarzanie" nie wynika z background-repeat, tylko wymagałoby np. wielu elementów albo innych technik (siatki, listy, pseudoelementów).
  • "tła każdego ze znaczników akapitu." – tło dotyczy elementów wskazanych selektorem w regule. Bez pewności, że selektorem jest p, nie można zakładać, że obejmuje akapity.
  • "rysunku umieszczonego w tle strony w poziomie." – poziom oznaczałby oś X (lewo–prawo). To inny kierunek niż pion (Y), więc nie pasuje do definicji mówiącej o powtarzaniu w pionie.

Wskazówka egzaminacyjna: zawsze rozdzielaj w głowie tło (background) od obrazu w treści (<img>) oraz kojarz X = poziomo, Y = pionowo. To pozwala szybko eliminować odpowiedzi o niepasującym kierunku lub o złym mechanizmie (HTML zamiast CSS).

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Powtarzanie tła oznacza, że obraz ustawiony jako background-image jest kopiowany (kafelkowany) tyle razy, ile potrzeba, aby wypełnić obszar elementu. Steruje tym właściwość background-repeat, która może ograniczać powtarzanie do jednego kierunku lub je wyłączyć.
Wartość repeat-y oznacza powtarzanie obrazu tła w pionie (oś Y, góra–dół). Obraz jest układany w kolumnie jeden pod drugim, a w poziomie pozostaje pojedynczy (nie jest powielany na lewo i prawo).
Wartość repeat-x oznacza powtarzanie tła w poziomie (oś X, lewo–prawo). Obraz tła jest układany w wierszu obok siebie, a w pionie pozostaje pojedynczy. To częste ustawienie dla poziomych pasków lub ornamentów.
Element <img> jest częścią treści HTML, a nie tłem. background-repeat działa tylko na tło elementu ustawione w CSS (np. przez background-image). Jeśli chcesz "powielić obraz", robisz to inaczej: przez tło, wiele elementów lub układy (grid/flex).
Najczęściej spotkasz: repeat (kafelkowanie w obu kierunkach), no-repeat (bez powtarzania), repeat-x (poziomo) i repeat-y (pionowo). W praktyce istnieją też inne warianty, ale te cztery są typowe w zadaniach egzaminacyjnych.
Powtarzanie tylko w pionie wykorzystuje się, gdy grafika ma tworzyć pionowy wzór, np. boczny pasek, teksturę w kolumnie lub dekoracyjne tło panelu. Dzięki temu tło dopasowuje się do wysokości sekcji bez rozciągania obrazu.
Tło ustawione w CSS zawsze dotyczy konkretnego elementu wskazanego selektorem (np. body, div, p). "Tło strony" w praktyce często oznacza tło elementu body lub głównego kontenera. Sprawdź selektor w regule, aby wiedzieć, czego dotyczy deklaracja.
Tylko wtedy, gdy reguła CSS jest przypisana do selektora p (lub innego, który obejmuje akapity). Jeśli selektor dotyczy np. body albo klasy kontenera, powtarzanie będzie dotyczyło tła tego elementu, a nie automatycznie wszystkich akapitów.
Użyj narzędzi deweloperskich (DevTools): wybierz element, sprawdź zakładkę stylów i odczytaj background-repeat. Następnie obserwuj efekt: jeśli obraz układa się w wierszu, to X; jeśli w kolumnie, to Y; jeśli w siatce, to oba kierunki.
Najczęstsze pomyłki to: mylenie osi X z Y, przenoszenie pojęcia "powtarzania" na <img> zamiast tła oraz ignorowanie selektora (zakładanie, że chodzi o akapity lub całą stronę). Pomaga prosta reguła: X=poziomo, Y=pionowo.
info

Około 61% zdających odpowiada poprawnie na to pytanie. średnie

Eksperci podkreślają: "Powtarzanie w definicji tła CSS dotyczy obrazu ustawionego jako background, a nie elementu &lt;img&gt;."

Źródła:

  • MDN Web Docs: "background-repeat" — https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat (dostęp: 2026-03-05)
  • MDN Web Docs: "background" — https://developer.mozilla.org/en-US/docs/Web/CSS/background (dostęp: 2026-03-05)
  • W3C/CSSWG: "CSS Backgrounds and Borders Module Level 3" (definicja powtarzania tła) — https://www.w3.org/TR/css-backgrounds-3/ (dostęp: 2026-03-05)

Materiały:

  • Dokumentacja MDN: sekcja o background-repeat oraz tła w CSS
  • Specyfikacja CSS Backgrounds and Borders (definicje powtarzania tła)
  • Ćwiczenia praktyczne: tworzenie prostych stron z różnymi ustawieniami background-repeat w przeglądarce

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego