KWALIFIKACJA INF3 - STYCZEŃ 2020

PYTANIE NR 4.
W języku HTML, aby wstawić na stronę obraz zapisany w formacie JPG, należy zastosować znacznik
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Obraz w dokumencie HTML osadza się elementem <img>.
Wskazuje on plik graficzny przez atrybut src (np. "src=..."), niezależnie od tego, czy jest to JPG/JPEG, PNG lub GIF. Nie istnieją znaczniki <jpg> ani <src>, a <table> służy do tabel.

Pełne wyjaśnienie:

W HTML do wstawiania (osadzania) obrazów używa się elementu <img>. Jest to element "pusty" (void), czyli nie ma treści i zwykle nie występuje w parze otwierający–zamykający. Kluczowe jest to, że typ pliku (JPG/JPEG, PNG, GIF, SVG) nie zmienia nazwy elementu – zawsze używa się <img>.

Aby przeglądarka wiedziała, jaki plik pobrać i wyświetlić, w <img> podaje się atrybut src (source), np.: <img src="foto.jpg" alt="Opis">. Atrybuty są częścią składni elementu, ale same w sobie nie są znacznikami – dlatego zapis <src> jest błędny (taki element w HTML nie istnieje).

Odpowiedź <jpg> także jest niepoprawna, ponieważ HTML nie definiuje osobnych znaczników zależnych od rozszerzeń plików. Rozszerzenie ".jpg" to cecha zasobu, a nie nazwa elementu języka znaczników.

Opcja <table> dotyczy budowy tabel (wiersze, kolumny, komórki) i nie służy do osadzania obrazów. Obraz można co najwyżej umieścić wewnątrz tabeli jako zawartość komórki, ale nadal sam obraz wstawia się przez <img>.

W praktyce (także egzaminacyjnie) warto pamiętać o atrybucie alt, bo wpływa na dostępność i poprawne zachowanie strony, gdy obraz nie może się załadować.

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Element <img> służy do osadzania obrazu w dokumencie HTML. Nie zawiera treści tekstowej – wskazuje plik graficzny przez atrybut src i powinien mieć opis alternatywny w atrybucie alt.
Użyj elementu <img> i podaj ścieżkę do pliku w atrybucie src, np. <img src="zdjecie.jpg" alt="Opis">. Format JPG/JPEG nie zmienia składni – ważne jest poprawne src i sensowne alt.
HTML nie definiuje znaczników zależnych od rozszerzeń plików. "JPG" opisuje format pliku, a nie konstrukcję języka. Do obrazów używa się jednego elementu <img>, a konkretny plik (jpg/png/gif) wskazuje się w src.
src (source) to atrybut wskazujący lokalizację zasobu, czyli pliku obrazu do pobrania i wyświetlenia. Może to być ścieżka względna (np. images/foto.jpg) albo adres URL. Sam src nie jest osobnym znacznikiem.
Najczęściej sprawdzane są: src (skąd pobrać obraz) oraz alt (opis alternatywny dla dostępności i sytuacji, gdy obraz się nie wczyta). Czasem pojawiają się też width/height, ale kluczowe jest rozróżnienie elementu i atrybutu.
Element <img> należy do elementów pustych (void), więc w HTML nie ma osobnego znacznika zamykającego typu </img>. W XHTML spotyka się zapis samodomykający, ale w typowym HTML wystarczy poprawny element z atrybutami.
Znacznik (element) to nazwa w nawiasach ostrych, np. <img> lub <table>. Atrybut to para nazwa=wartość wewnątrz elementu, np. src="foto.jpg". Typowy błąd to traktowanie atrybutu jak elementu, np. "<src>".
<table> buduje strukturę tabeli (wiersze i komórki) i nie jest mechanizmem osadzania grafiki. Obraz może być zawartością komórki tabeli, ale sam wstawia się go nadal elementem <img> z atrybutem src.
Gdy obraz jest wyłącznie dekoracją tła (np. pattern, tło baneru), często lepiej ustawić go w CSS jako background-image. Gdy grafika niesie treść (np. zdjęcie produktu, infografika), użyj <img> i dodaj alt dla dostępności.
Najczęstsze problemy to: zła ścieżka w src (plik w innym folderze), brak lub bezsensowny alt, mylenie elementu z atrybutem (np. "<src>"), oraz literówki w nazwie pliku. Warto testować w przeglądarce i sprawdzać konsolę.
info

Statystycznie 70% uczniów zna prawidłową odpowiedź. średnio łatwe

Specjaliści zwracają uwagę: "Obraz w dokumencie HTML osadza się elementem &lt;img&gt;.Wskazuje on plik graficzny przez atrybut src (np. "src=..."), niezależnie od tego, czy jest to JPG/JPEG, PNG lub GIF."

Źródła:

  • WHATWG HTML Living Standard – sekcja "The img element" (specyfikacja HTML), https://html.spec.whatwg.org/multipage/embedded-content.html#the-img-element - accessed 2026-03-01
  • MDN Web Docs – "&lt;img&gt;: The Image Embed element", https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img - accessed 2026-03-01
  • W3C – HTML 5.2 Recommendation, sekcja dotycząca osadzania treści (embedded content) i elementu img, https://www.w3.org/TR/html52/ - accessed 2026-03-01

Materiały:

  • Dokumentacja WHATWG HTML – sekcja dotycząca elementu &lt;img&gt;
  • MDN Web Docs – opis elementu &lt;img&gt; i atrybutów src/alt
  • Kurs podstaw HTML (struktura dokumentu, elementy osadzające media)

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego