Specializovan² t²denφk o v²poΦetnφ technice
o Internetu
(CW 19/97)

---

WWW dφlna
Popisky obrßzk∙

Ji°φ Kosek ml.

Vklßdßnφ obrßzk∙ do HTML strßnek je vcelku jednoduchΘ a nabφzφ nßm pom∞rn∞ volnou ruku. ProblΘm vÜak nastane, pokud chceme obrßzek doplnit i jeho popiskem. Element IMG nßm nenabφzφ ₧ßdnou mo₧nost specifikovat popisek obrßzku tak, jak to znßme nap°φklad u tabulek (pomocφ elementu CAPTION). Pokud do textu umφstφme jako jeden odstavec popisek obrßzku a jako druh² odstavec samotn² obrßzek, ztratφme tφm mnoho z mo₧nostφ pro umφst∞nφ obrßzk∙ (nap°. obtΘkßnφ obrßzk∙ textem) a navφc se nßm p°i tisku strßnky m∙₧e stßt, ₧e popisek se objevφ na jinΘ strßnce ne₧ samotn² obrßzek.

K °eÜenφ tohoto problΘmu nßm v²born∞ poslou₧φ tabulky. U nich lze specifikovat jejich popisek. Vytvo°φme tedy tabulku, kterß bude mφt pouze jednu bu≥ku a do tΘto bu≥ky umφstφme obrßzek. CelΘ to m∙₧e vypadat takto:

<TABLE>

<CAPTION>Obr. 1: Plynovß turbφna</CAPTION>
<TR><TH><IMG SRC="turbina.gif">
</TABLE>

Prßv∞ mezi tagy <CAPTION> a </CAPTION> umφstφme popisek obrßzku. Tagem <TR> zahßjφme °ßdku tabulky a tagem <TH> samotnou bu≥ku. Tag <TH> jsme pou₧ili namφsto <TD> zßm∞rn∞ -- obrßzek bude se sv²m popiskem vycentrovßn. (Obsah bu≥ky uvozenΘ tagem <TH> je centrovßn a popisek tabulky je vycentrovßn nad celou tabulkou.)

Toto °eÜenφ je uspokojivΘ, lze je vÜak zlepÜovat. Prvnφ v∞cφ, kterou lze zm∞nit, je umφst∞nφ popisku -- ten se nßm normßln∞ zobrazφ nad obrßzkem. N∞kdy vÜak pot°ebujeme popisek umφstit pod obrßzek -- staΦφ pak u CAPTION pou₧φt atribut ALIGN a p°i°adit mu hodnotu BOTTOM.

U ÜirÜφch obrßzk∙ je p∞knΘ, pokud jsou vlo₧eny mezi text a jsou vycentrovßny. Naopak u u₧Üφch a menÜφch obrßzk∙ je obvykle hezΦφ, pokud text obtΘkß kolem nich. Dosßhnout prvnφho efektu je celkem jednoduchΘ -- staΦφ celou tabulku pou₧itou pro vlo₧enφ obrßzku s popiskem uzav°φt mezi tagy <CENTER> a </CENTER>.

Pokud chceme, aby byl obrßzek i s popiskem obtΘkßn textem, pou₧ijeme u elementu TABLE atribut ALIGN a p°i°adφme mu hodnotu LEFT nebo RIGHT. Obrßzek pak bude bu∩ zprava, nebo zleva obtΘkßn textem.

U p°φliÜ mal²ch obrßzk∙ je lepÜφ vyhradit pro n∞ trochu vφce mφsta (aby se z popisku nestala dlouhß nudle). K tomu lze v²hodn∞ pou₧φt atribut WIDTH u elementu TABLE.

VÜechny poznatky si shrneme na nßsledujφcφ ukßzce. V²sledn² vzhled v prohlφ₧eΦi je na obrßzku 1:

...

<CENTER>
<TABLE>
<CAPTION ALIGN=BOTTOM>Obr. 1: Velk² obrßzek na celou Üφ°ku textu</CAPTION>
<TR><TH><IMG SRC="1mbill.gif">
</TABLE>
</CENTER>

<TABLE ALIGN=LEFT>
<CAPTION>Obr 2.: Prßce na silnici</CAPTION>
<TR><TH><IMG SRC="work.gif">
</TABLE>

...

<TABLE ALIGN=RIGHT WIDTH=30%>
<CAPTION ALIGN=BOTTOM>Obr 3.: Prßce na strßnce</CAPTION>
<TR><TH><IMG SRC="atwork.gif">
</TABLE>

...