Trudno spotkać stronę, na której nie było by obrazków, grafik czy galerii zdjęć. Ten element to niezwykle istotna część strony. Znacznie podnosi atrakcyjność i formę przekazu.
Wstawiamy obrazek na stronę
<img src="ścieżka_do _obrazka" alt="Opis obrazka" title="Tytuł obrazka"/>W powyższym przykładzie alt sprawi, że na stronie pojawi się opis w przypadku, gdyby obrazek nie został wyświetlony. Z kolei title wyświetli tytuł po najechaniu kursorem na obrazek. Należy pamiętać, że opis powinien być zgodny z obrazkiem.
<img src="../images/logo.png" alt="Logotyp; title="html/css" />
W przypadku jeśli obrazek jest zbyt duży, możemy zmniejszyć jego rozmiary.
<img src="../images/logo.png" width="100" height="25" />
Odsyłacz obrazkowy
<a href="miejsce_w_sieci_do_ktorego_linkujemy"><img src="ścieżka_do _obrazka" /></a>W poniższym przykładzie kliknięcie na obrazek przeniesie nas na górę strony.
Wstawienie obrazka do tekstu
Dodanie obrazka w dowolnej części tekstu w zależności od tego, w którym miejscu chcemy, aby się pojawił obliguje do zastosowania opływania (float):
<img src="../images/logo.png" style="float: left; margin-right: 20px;" />
<p>To jest tekst, który będzie opływał obrazek z prawej strony.</p>Przykład
To jest tekst, który będzie opływał obrazek z prawej strony.