Znacznik <img> w HTML

Słownik kwalifikacji INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych

Znacznik <img> w HTML

Znacznik <img> służy w HTML do umieszczania obrazów na stronie internetowej. Za jego pomocą można wyświetlić pliki graficzne, np. w formatach JPG/JPEG, PNG, GIF, SVG czy WebP.

<img> jest znacznikiem pustym, czyli nie ma osobnego znacznika zamykającego. Nie zapisuje się go jako <img></img>, tylko jako pojedynczy element.

Najważniejsze atrybuty

  • src — określa ścieżkę do pliku graficznego,
  • alt — tekst alternatywny wyświetlany, gdy obraz nie może zostać załadowany; ważny także dla dostępności,
  • width — szerokość obrazu,
  • height — wysokość obrazu.

Przykład użycia

<img src="obrazek.jpg" alt="Opis obrazka">

W tym przykładzie przeglądarka próbuje wczytać plik obrazek.jpg. Jeżeli plik znajduje się w tym samym folderze co dokument HTML, ścieżka jest poprawna. Jeśli obraz jest w podfolderze, należy podać np.:

<img src="img/obrazek.jpg" alt="Opis obrazka">

Częsty błąd egzaminacyjny

Atrybut src nie jest znacznikiem HTML. Poprawny znacznik to <img>, a src jest tylko jego atrybutem:

<img src="plik.jpg" alt="Zdjęcie">

Nie istnieją znaczniki HTML takie jak <jpg> ani <src> do wstawiania obrazów.