Kategorie
Kurs HTML

Obrazki

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" />
Logo

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

Logo

To jest tekst, który będzie opływał obrazek z prawej strony.

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *