Definice: zapomenutΘ tagy

Seznam definic - Compact - Dal╣φ mo╛nosti stylovßnφ - Jde to tabulkami

Seznam definic

Snad u╛ v prvnφ verzi jazyka HTML existovaly znaΦky na vymezenφ definic. Proto╛e www se m∞lo stßt hlavn∞ v∞deck²m prostorem, bylo zavedenφ definic pochopitelnΘ. Tak╛e vznikly t°i HTML tagy: <dl>, <dt> a <dd>, kterΘ se udr╛ely dodnes.

<DL>

Anglicky Definition List, tedy seznam definic. Uvnit° tohoto pßrovΘho tagu se majφ vyskytovat pßrovΘ znaΦky <dt> a <dd>

<DT>

Definovan² termφn. Zobrazuje se normßln∞ vlevo. Anglicky Defined Term. V dal╣φm textu vnit°ek tagu <dt> naz²vßm "termφn".

<DD>

Definice p°φslu╣φcφ k p°edchozφmu termφnu. Zobrazuje se o °ßdek nφ╛ a je asi o palec odsazenß od levΘho okraje. Tag <dd> naz²vßm "definicφ".

Syntaxe

Sprßvn∞ by m∞l zdrojov² k≤d seznamu definic vypadat takto:
<dl>
<dt>Prvnφ termφn</dt>
<dd>V²klad prvnφho termφnu</dd>
<dt>Druh² termφn</dt>
<dd>V²klad druhΘho termφnu</dd>
</dl>
Teoreticky se nemusφ psßt uzavφracφ tagy </dt> a </dd>, jß je rad∞ji pφ╣u, proto╛e se tφm nic nezkazφ.

Pou╛itφ a zneu╛itφ

Proto╛e Internet u╛ dßvno nenφ Φist∞ v∞deckΘ mΘdium, lze t∞chto tag∙ zneu╛φvat pro formßtovacφ ·Φely. Pokud je ale nßhodou n∞kdy pot°eba vysv∞tlit v∞t╣φ mno╛stvφ termnφn∙, neexistuje lep╣φ a p°ehledn∞j╣φ nßstroj. Jß sßm rßd u╛φvßm definic pro seznam zm∞n sv²ch strßnek, kdy na mφst∞ termφnu pφ╣u datum a v definici popisuji ty zm∞ny. P°φklad:

31. Φervence 2000

Pφ╣u tuhle strßnku

1. srpna

Asi ji rad∞ji sma╛u :-)

Compact

Tag compact

Pou╛itφ atributu "compact" u tagu <dl compact> umo╛≥uje defincicφm (tag dd), aby se zobrazovaly vedle definovanΘho termφnu, tedy pokud se tam vejdou. Kdy╛ se compact nepou╛ije, (tedy v normßlnφm p°φpad∞) definice se zobrazφ a╛ na dal╣φm °ßdku.

Nestandardnφ!

Musφm zmφnit, ╛e tento atribut je pova╛ovßn za nestandardnφ, tak╛e by se nem∞l pou╛φvat. Podle m²ch zku╣enostφ je ale podporovßn v IE i NN, tak╛e se hodφ, t°eba╛e mß n∞kterΘ chybky, kterΘ popisuji nφ╛e.

DΘlka termφnu

N∞kdy je ale definovan² termφn p°φli╣ dlouh², tak╛e se vedle n∞j definice prost∞ nevejde. Na╣t∞stφ se dß nastavit lev² okraj definic tak velk², aby se do n∞j ve╣ly i relativn∞ dlouhΘ termφny. Lev² okraj se nastavuje CSS stylem: dd {margin-left: 150px} t°eba. (Stejn∞ tak je mo╛no pou╛φt i padding.)

P°φli╣ dlouh² termφn, tak dlouh², ╛e se to vedle n∞j nem∙╛e vejφt

Pokud vedle termφnu prost∞ nenφ mφsto, definice zaΦφnß odsazenß na novΘm °ßdku, tak jako by atributu "compact" nebylo. Pokud ale nßhodou termφn kousek p°eteΦe na dal╣φ °ßdku, definice se zobrazφ vedle toho kousku.

Netscape

Netscape verze 4 podporuje atribut compact, ale neumo╛≥uje nastavenφ velikosti odsazenφ pomocφ CSS. Ba co vφc, dokonce potom neodsadφ definici v∙bec! To nenφ dobrΘ. Na╣t∞stφ se dß Netscape oblafnout, aby definici odsadil alespo≥ defaultn∞: do zßvorky stylu staΦφ p°idat n∞jak² nesmysl, t°eba dd {margin-left: 100px; nesmysl}. Pak bude Netscape ignorovat celou tu slo╛enou zßvorku, tak╛e to zobrazφ alespo≥ normßln∞ o palec odsazenΘ.

Nep°φjemnost v IE 5

UrΦitΘ tagy na zaΦßtku definice zp∙sobujφ, ╛e Inetrnet Explorer 5 ignoruje atribut compact u <dl>! Zjistil jsem to u odkaz∙, obrßzk∙ a tag∙ <b> a <span>, tak╛e p°edpoklßdßm, ╛e to d∞lajφ skoro v╣echny tagy. Ale t°eba <object> to nezp∙sobφ. JedinΘ trochu sch∙dnΘ °e╣enφ je dßvat na zaΦßtek pφsmeno nebo alespo≥ pevnou mezeru &nbsp;, to ale kazφ dojem.

IE 4 je v pohod∞ a ╛ßdn² tag na zaΦßtku definice mu nevadφ.

SkotaΦenφ IE 4

Internet Explorer 4 se chovß naprosto neuv∞°iteln∞, pokud se na prvnφm °ßdku compact definice s udan²m margin-left objevφ odkaz. Kliknutφm na n∞j cel² text definice poskoΦφ doprava, jakoby to nebyl margin, ale zßrove≥ i text-indent. Na odkaz se potom musφ kliknout znova. 

MinulΘ t°i odstaveΦky jsou jasn²m d∙kazem nepodporovanosti atributu compact.

Zßvaznost syntaxe

Je nutnΘ dßvat atribut compact do tagu <dl>, jinde prost∞ nefunguje (ani v dd, ani v dt).

Compact v CSS

K velkΘ lφtosti mnoh²ch "styla°∙" se musφ tag compact vpisovat p°φmo do tagu <dl>. V nßvrhu CSS2 sice existuje novß hodnota vlastnosti display: compact, kterß zatφm ale nenφ nikde podporovßna. A╛ bude, tak se to bude zapisovat do stylopisu: dl {display: compact}, zatφm to ale nemß smysl.

FrontPage 98

Dejte si pozor na tenhle Microsoftφ editor: namφsto <dl compact> zapisuje do k≤du <dl codebase="true">. V editoru to vypadß jako compact, ale v ╛ßdnΘm prohlφ╛eΦi to tak nefunguje.

Dal╣φ mo╛nosti stylovßnφ

Odsazenφ prvnφ °ßdky

Dokonal² ╣pek p°edstavuje compact a odsazenφ prvnφ °ßdky. D∞lß se to taktΘ╛ pomocφ CSS styl∙, vlastnostφ text-indent: dd {text-indent: 200px}. Lze to pou╛φt namφsto odsazenφ celΘ definice vlastnostφ margin. Potom to vypadß, jako by v textu byl tabulßtor.

KombinovanΘ

Je mo╛no pou╛φt i obou odsazenφ najednou (margin i indent), co╛ m∙╛e p°inΘst opravdu hezkou ·pravu. Mimochodem, Netscape ·pln∞ vlastnost text-indent u tagu <dd> ignoruje, tak╛e se nenφ t°eba obßvat, ╛e by to vypadalo ╣patn∞.

TuΦn² termφn

V tomto textu schvßln∞ ztuΦ≥uji v╣echny termφny. Normßln∞ se tuΦn∞ nezobrazujφ. StaΦφ napsat do stylopisu deklaraci dt {font-weight: bold}, Φφm╛ se podle zßsad CSS ztuΦnφ v╣echny definovanΘ termφny. Samoz°ejm∞ lze pou╛φt jak²koliv jin² mysliteln² formßt. V²hodou tohoto formßtovßnφ je fakt, ╛e funguje i v Netscapu. A je hezkΘ.

Zarovnßnφ doprava

Text definice se dß zarovnßvat doprava pouze pomocφ CSS styl∙: dd {text-align: right; IE} -- zkusil jsem <dd align="right"> a nefungovalo to. P°edstavte si, co v╣echno se s tφm dß ud∞lat. T°eba nadpis a datum na jednom °ßdku. «el, Netscape to nechßpe a zarovnßvß doprava termφn. Tak╛e p°ichßzφ ke slovu op∞t nesmysl v deklaraci stylu (to je to IE).

Nadpis

datum: 31. Φervence 2000

Zano°enΘ definice

Dal╣φ seznam definic (<dl compact>) uvnit° jednΘ definice (<dd>)

prvnφ termφn

definice 1. termφnu

druh² termφn

definice druhΘho

Jde to tabulkami

V╣echno, co jsem popisoval v tomto textu, se dß spolehliv∞ji ud∞lat i pomocφ tabulek, t°eba╛e ne tak elegantn∞. Mimochodem prßv∞ existence tabulek je podle m∞ d∙vodem, proΦ se dnes seznamy definic skoro v∙bec nepou╛φvajφ.

Vizte tΘ╛: Tabulky, P°ehled hodnot CSS, ┌vod do CSS, Zßklady HTML,  Okraje objekt∙ - margin a padding