HTML Images

S HTML mô?ete zobrazi? obrázky v dokumente.

Príklady

Vkladanie obrázkov
Tento príklad predvádza, ako zobrazi? obrázky na va?ej stránke.

Vkladanie obrázkov z iných miest
Tento príklad predvádza, ako zobrazi? obrázky z iného adresára alebo iného servera vo va?ej stránke.

(Viac príkladov nájdete na spodku tejto stránky)

src atribút tágu obrázka

V HTML, obrázky sa definujú s <img> tágom. 

<img> tág je prázdny, ?o znamená, ?e to obsahuje len atribúty a nemá to ?iadny koncový tág.

Na zobrazenie obrázka na stránke potrebujete ur?i? src atribút. Src znamená "source" source". Hodnota src atribútu je URL adresa obrázka, ktorý chcete zobrazi? na va?ej stránke.

Syntax definovania obrázka:

<img src="url">

URL odkazuje na miesto, kde bol obrázok uschovaný. Obrázok menom "boat.gif" umiestnený v adresári "images" na tejto stránke, má URL: "../images/boat.gif".

Browser vlo?í obrázok do dokumentu tam, kde sa nachádza img tág. Ak vlo?íte obrázok medzi dva odstavce, browser uká?e najprv prvý odstavec, potom obrázok a potom druhý odstavec.

Alt Attribút

alt atribút sa pou?íva na definúciu "alternatívneho textu" na obrázok. Hodnota tohoto tágu je va?a vo?ba:

<img src="boat.gif" alt="Ve?ká lo?">

"alt" atribút vraví ?íta?u, ?o mu na stránke chýba, ke? nevie na?íta? obrázok. Prehliada? potom zobrazí alternatívny text namiesto obrázka. Je to dobré, ak niekto prehliada va?u stránku s text-only browsermi, lebo takto sa im zobrazí aspo? text na mieste obrázka, ktorý nevidia, namiesto prázdneho miesta.

Poznámky - Vhodné Tipy

Ak HTML súbor obsahuje obrázky - ka?dý z nich je potrebný na?íta?, aby bola zobrazená stránka správne. Tak?e vkladajte obrázky na stránky opatrne.

Viac Príkladov

Obrázok na pozadí
Tento príklad predvádza, ako prida? obrázok na pozadí v HTML dokumente.

Zarovnanie obrázkov
Tento príklad predvádza, ako zarovna? obrázok v texte.

Necha? obrázok vzná?a? sa
Tento príklad predvádza, ako necha? obrázok vzná?a? sa do?ava alebo doprava v odstavci.

Nastavi? obrázky do rôznych ve?kostí
Tento príklad predvádza, ako nastavi? obrázky do rôznych ve?kostí.

Zobrazi? alternatívny text pre obrázok
Tento príklad predvádza, ako zobrazi? alternatívny text pre obrázok. "alt" atribút vraví ?íta?u, ?o má namiesto chýbajúceho obrázka doplni?. Je dobré, to nastavi? na ka?dý obrázok na stránke.

Urobi? hyperlink obrázku
Tento príklad predvádza, ako urobi? obrázok, aby bol odkaz.

Vytvori? image map
Tento príklad predvádza, ako vytvori? mapu obrázkov s kliknute?nými plochami. Ka?dá plocha je hyperlink.

Zmena obrázka na image map
Tento príklad predvádza, ako zmeni? obrázok na mapu obrázkov. Uvidíte, ?e ke? prejdete my?ou cez obrázok, súradnice sa vám zobrazia na statusbare (dole vo webbrowseri).

Tágy obrázkov