Element img

06 sierpnia 2012
1 gwiadka2 gwiazdki3 gwiazdki4 gwiazdki5 gwiazdek

Element img służy do wstawiania obrazów graficznych na strony internetowe. Należy pamiętać, że obraz taki nie zawsze może być widoczny, ponieważ użytkownicy korzystają także z przeglądarek tekstowych lub celowo wyłączają pobieranie obrazów, aby przyspieszyć wczytywanie stron.

Kontekst użycia

Modele treści HTML5 Brak, ponieważ jest to element pusty
Elementy nadrzędne Każdy element przyjmujący treścią ogólną
Elementy potomne

Brak, ponieważ jest to element pusty

Znaczniki Element pusty
Normy HTML 4.01 — podrozdział 13.2; HTML 5 — podrozdział 4.8.1
Interfejs DOM HTMLImageElement
Różnice między HTML 4.01 a HTML 5

W języku HTML 5 element img ma nowy atrybut crossorigin

Atrybuty align, longdesc, name, hspace, vspace HTML 4.01 w HTML 5 zostały usunięte

Przykłady użycia

Obraz graficzny w formacie PNG
<img src="mysigiel.png" alt="Mysigiel pasący się na łące" />

Obsługa przez przeglądarki

Firefox Chrome Opera Safari Internet Explorer

Atrybuty obowiązkowe

Atrybutem obowiązkowym elementu img jest src określający ścieżkę do wstawianego pliku graficznego. W standardzie HTML nie zapisano, jakie formaty grafiki mają być obsługiwane, przez co każda przeglądarka może obsługiwać inny zestaw tych formatów.

Atrybuty opcjonalne

Atrybuty globalne HTML 5 oraz:

Atrybut Opis
alt

Zawiera tekst zastępujący obraz przeznaczony dla osób niewidomych albo korzystających z przeglądarek nie wczytujących grafiki. Brak tego atrybutu oznacza, że obraz jest ważną częścią treści, ale nie ma dla niego tekstowego odpowiednika. Jego ustawienie na pusty łańcuch oznacza, że obraz nie jest kluczową częścią treści

crossorigin Służy do konfigurowania żądań CORS dla danych pobieranych przez element multimedialny
height Określa wysokość obrazu w pikselach
ismap Oznacza, że element daje dostęp do serwerowej mapy obrazkowej
usemap

Przypisuje element img do elementu map. Wartością atrybutu usemap musi być nazwa z krzyżykiem elementu map, np.:

      <img src="grafika.png" usemap="#mapa" />
      <map name="mapa">...</map>
width Określa szerokość obrazu w pikselach

Dyskusja

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