Képek elhelyezése a HTML dokumentumban
A HTML formátumú dokumentumban képeket - grafikákat - is elhelyezhetünk. Az <IMG SRC="elérési_út/fájlnév.kit"> utasítás a szöveg aktuális pozíciójába helyezi a megadott képet.
Ennél azért a legegyszerűbb szövegszerkesztő program is többet nyújt. A HTML dokumentum csinosítására is vannak a képek elhelyezésének finomabb lehetőségei is. Ha ezeket mind kihasználjuk, akkor az utasítás a következőképpen fog kinézni: <IMG ALIGN="hely" SRC="elérési_út/fájlnév.kit" HSPACE="vszám" VSPACE="fszám" WIDTH="szméret" HEIGHT="mmeret" UNITS="egység" USEMAP="#jelző" ISMAP ALT="szöveg">.
Az ALIGN opció meghatározza a kép igazításának módját, lehetséges értékei: top, middle, bottom, left, right.
A HSPACE a kép melletti vízszintes térközt, a VSPACE pedig a függőleges térközt (ha úgy tetszik: margókat) határozza meg.
A WIDTH a szélességét, a HEIGHT pedig a magasságát adja a képnek, az UNITS által meghatározott egységben (pixel vagy en).
Az ALT azt a szöveget adja meg, amelyet nem grafikus böngészők használata esetén meg fog jelenni a kép helyett.
amellyel egy hivatkozási térképet kell megadni. Az <AREA> utasításból természetesen több is szerepelhet. A SHAPE opció a circle, rect, polygon értékeket veheti fel, amikor circle (kör) esetén a COORDS három vesszővel elválasztott koordinátát tartalmaz (középx,középy,sugár), rect (téglalap) esetben négyet (balfelsőx,balfelsőy,jobbalsóx,jobbalsóy), a polygon (sokszög) esetén pedig minden csúcs koordinátáit meg kell adni. A <MAP NAME="jelző">, </MAP> utasításpárral körülhatárolt hivatkozási rész külön fájlban is elhelyezhető. Ekkor az USEMAP opció kimarad. - Vigyázat az ISMAP nem marad el! - Helyette a <A HREF="fájlnév.map"> és az </A> utasítások közé kell zárni az <IMG SRC=...> utasítást. (Ahol a fájlnév.map annak a fájlnak a neve, URL-je, amely a hivatkozásokat tartalmazza.)
Az alábbi példa ugyanazon kép elhelyezésére több variációt tartalmaz (az itt szereplő példában a példadokumentum szövegei rövidítve szerepelnek):
<MAP NAME="osztott">
<AREA SHAPE="circle" COORDS="130,130,50" HREF="#vege">
</MAP>
Makó város címere szövegbe beszúrva
<IMG SRC="k10.gif" ALT="Makó címere" USEMAP="#osztott" ISMAP>
így jelenik meg ...
<P>
<HR>
<P>
<IMG ALIGN="right" SRC="k10.gif" WIDTH="100" ALT="...">
Ugyanez jobbra igazítva és arányosan kicsinyítve ...
<P>
<IMG ALIGN="left" SRC="k10.gif" VSPACE=20 HEIGHT="100" ALT="...">
Ugyanez balra igazítva és arányosan kicsinyítve ...
<P>
<HR>
<P>
<IMG ALIGN="top" SRC="k10.gif" HSPACE=40 WIDTH="100" ALT="...">
Ugyanez a szöveg felső széléhez igazítva ...
<P>
<IMG ALIGN="middle" SRC="k10.gif" WIDTH="100" HEIGHT="100" UNITS="en" ALT="...">
Ugyanez sorközépre igazítva, valamint ...
<P>
<IMG ALIGN="bottom" SRC="k.gif" WIDTH="200" HEIGHT="100" UNITS="pixel" ALT="...">
Ugyanez a sor alsó széléhez igazítva, valamint ...
<P>
<A NAME="vege">VÉGE</A> 
0 responses to “Képek elhelyezése a HTML dokumentumban”