HTML manuál:

Příklady HTML textu:

HTML zobrazení:

Definování:
<img src="obrazek.gif" alt="obr." align="top| middle| bottom| left| right| absmiddle| baseline">
<img> ... nepárový tag vymezuje místo zobrazení
src= ... URL grafického souboru - definuje soubor
<img src= ... adresa grafickému souboru
alt= ... alternativní text - popis obrázku, který se objeví, pokud nad ním necháme kurzor myši
Rozměry:
width= ... šířka
height= ... výška
border="číslo" ... šířka rámečku
Zarovnání:
align="top| middle| bottom| left| right| absmiddle| baseline" ... způsob zarovnání obrázku:
top ... horní okraj grafiky s horním okrajem řádku
middle ... střed grafiky na účaří řádku
bottom ... dolní okraj na dolní okraj řádku
left ... zarovnání grafiky vlevo - text zprava
right ... zarovnání grafiky vpravo - text zleva
absmiddle ... střed grafiky na střed řádku
baseline ... dolní okraj grafiky bude zarovnán na účaří řádku
Odsazení:
vspace="vertik.odsazení"- implicitně 0
hspace="horiz.odsazení" - implicitně 0
Vymezení citlivé oblasti:
usemap= ... URL na definici citlivých ploch obrázku (prvek MAP)
<area href| target| nohref| shape| coords > ... nepárový tag, sloužící k vymezení plochy (oblasti) pro umístění grafickém objektu (odkazu)
<area href=> ... URL cíle odkazu
<area target=> ... jméno okna nebo rámce, ve kterém má být zobrazen dokument navázaný na tento odkaz
<area nohref> ... určuje, že se na oblast nebude vztahovat odkaz
<area shape=> ... tvar oblasti obrázku
<area shape=rect> ... obdélník
<area shape=circle> ... kruh
<area shape=polygon> ... mnohoúhelník
<area coords=> ... souřadnice a rozměry oblasti obrázku
<area coords=x, y, r> ... souřadnice středu a poloměru kruhu
<area coords=x1, y1, x2, y2>
... souřadnice levého horního a pravého spodního rohu obdélníka
<area coords=x1, y1, ...> ... souřadnice jednotlivých vrcholů mnohoúhelníka
Několik rad závěrem:
Obrázky musí být ve formátu .gif nebo .jpg
Tvorbě a úpravě grafiky dobře poslouží řada programů (např. Photoshop)
Není vhodné používat velkých obrázků -
zabírají moc místa na disku a spouštějí se pomalu.

Rozměry:

<img src="Obr-gif/autor.gif" align="middle" alt="foto-autor" border="3" width="55" height="74" vspace="8" hspace="8">

Zarovnání:
______________________________
Zarovnání vlevo:

<img src="Obr-gif/software.gif"
alt="grafika vlevo - text vpravo" align=left
border=1>

______________________________
Zarovnání vpravo:

<img src="Obr-gif/software.gif"
alt="grafika vpravo - text vlevo" align=right
border=1>

______________________________
Zarovnání na střed:

<img src="Obr-gif/software.gif"
alt="střed grafiky na střed"align=absmiddle
border=1>

______________________________
Odsazení:
______________________________
Vertikální odsazení:

<img src="Obr-gif/software.gif" align="middle" alt="foto-autor" border="1" width="79" height="169" vspace="8"

______________________________
Odsazení:
______________________________
Horizontální odsazení:

<img src="obr-gif/software.gif" align="middle" alt="foto-autor" border="1" width="79" height="169" hspace="8">