Rozšíření HTML

Tag Význam Párový Podpora Prognóza
bgsound zvuk na pozadí ano Internet Explorer nevím
marquee běžící text ano Internet Explorer mrtvé
canvas bitmapová grafika ano všude možná se to časem chytne
svg vektorová grafika ano všude zářná budoucnost
video, audio video, audio ano všude problém s kodeky, ale časem se to snad ustálí
tagy struktury vyznačení významů části stránky ano všude zbytečnost
details a summary rozbalovací oblast ano Webkit (Chrome)  

 Rozšířeními HTML chápu značky, které nebyly nebo nejsou podporovány většinou prohlížečů. Jsou to jednak zastaralé tagy, jednak příliš nové tagy.

bgsound

Vloží do stránky zvuk na pozadí (angl. background sound). Nepárový tag vyskytující se v hlavičce. Podporuje Internet Explorer od verze 3. Uživatel může zvuk vypnout kliknutím na tlačítko stop, které je v prohlížeči. Jsou akceptovány soubory typu wav a mid, možná i další. <bgsound> doporučuji nepoužívat, protože to působí rušivě.

Atributy tagu <bgsound>
Atribut Význam Hodnoty
src adresa načítaného zvuku URL *.mid | *.wav
loop počet opakování číslo; -1 znamená "furt dokola"
delay odložení začátku přehrávání sekundy
volume hlasitost číslo; nula znamená plnou hlasitost, -10000 ticho
balance balance sterea -10000 až 10000; nula je normál

Příklad: 
<head>
...
<bgsound src="pisnicka.mid" loop="-1">
</head>

Více informací: zvuky na webových stránkách.

marquee

Jezdící text. Párový tag obklopující ten text. Prohlížeče, které <marquee> neznají, text zobrazují normálně. Podporujován ve všech běžných prohlížečích (aktualizováno 2012). Doporučuji marquee nepoužívat, protože to působí rušivě.

Pokud budete používat složitější nastavení, počítejte s tím, že se jejich chování v jednotlivých prohlížečích může lišit.

Atributy tagu <marquee>
Atribut Význam Hodnoty
direction kterým směrem má text rolovat down | left | right | up
behavior způsob rolování textu scroll | alternate | slide
loop počet rolování (pokud není uvedeno, je to nekonečno) číslo
scrollamount počet pixelů mezi dvěma fázemi animace pixely
scrolldelay počet milisekund na jednu změnu obrázku milisekundy
truespeed Všechny hodnoty scrolldelay nižší než 60 milisekund nebudou upraveny na 60 ms (což by se normálně stalo) bez hodnoty
width šířka posouvané oblasti (nikoli oblasti, v níž se posunuje) délka nebo procento
height výška oblasti, v níž se posunuje (čili funguje jinak než šířka) délka nebo procento
vspace vertikální okraj pixely
hspace horizontální okraj pixely
bgcolor barva pozadí barva
Tag <marquee>, atribut behavior
behavior= Význam
scroll text jede v daném směru
alternate text jede tam a pak zpátky
slide text přijede a zůstane

canvas

Bitmapová grafika. (Anglicky plátno.) Příklad napsat neumím, nikdy jsem se do toho neponořil. Neobejde se bez javascriptu, takže to je nad rámec tohoto popisu.

<canvas id="idecko" width="200" height="250"></canvas>

Příklad ukazuje <canvas>, který si na stránce zabere zadané rozměry (200 a 250 pixelů). Důležité je zadat parametr id, aby se potom dal tento konkrétní <canvas> používat ve skriptech. Jestli chcete kreslit javascriptem, pak canvas je takové vaše plátno.

svg

Vektorová grafika. V Exploreru podporováno od verze 9, takže už docela dobře. SVG je celý komplexní jazyk na zobrazování vektorové grafiky. I když se HTML podobá, není to HTML. Výhodné ale je, že se objekt v jazyce SVG může napsat přímo do HTML zdrojáku. Stačí, že se uzavře do tagu <svg> a bude fungovat.

Sám svg nepoužívám, takže se jenom namlsáme příkladem:

<svg width="300" height="150">
    <rect width="200" height="80" style="fill:red; stroke-width:5px; stroke:blue;">
Sem patří hláška, kdyby prohlížeč SVG nepodporoval.
</svg>

Tag <svg> si na stránce vymezí prostor, který je určen atributy width a height. Rect je klíčové slovo pro obdélník. Obdélník má rozměry 200 a 80 a styl. Styl se zapisuje podobně jako CSS, ale jak jistě vidíte, obsahuje úplně jiné vlastnosti jako v tomto příkladu stroke, fill nebo stroke-width. Příklad vykreslí obdélník vyplněný červenou barvou s modrým rámečkem tlustým 5 pixelů.

Na http://www.w3schools.com/svg/svg_reference.asp je slušná referenční příručka svg tagů pro kreslení různých objektů.

video

Tag pro video. Nepíšu příklad, protože jsem to nikdy nepotřeboval. Většinou, když vkládám do stránky video, dělám to objektem z youtube.

Problém se zavedením tagu video, jestli jsem to dobře pochopil, spočívá v tom, že výrobci prohlížečů se nechtějí dohodnout, čí formát videa to bude umět přehrávat a jakým kodekem.

audio

Tag pro zvuk, písničku apod. Nepodporuje Explorer, takže to nelze použít. Na vkládání zvuku se normálně používá tag object nebo embed, přičemž dnešní prohlížeče už umějí přehrát většinu formátů.

Tagy struktury

Přeneseny na stránku strukturní tagy v HTML 5.

Details a summary

Tag details ohraničuje oblast obsahu, kterou si může uživatel skrýt nebo zobrazit. Oblast má své viditelné shrnutí s tagu <summary>.

Příklad:

<details>
<summary>Zobrazený řádek</summary>
Text, který se rozbalí po kliknutí na zobrazený řádek. Po dalším kliknutí může zase zmizet.
</details>

Zobrazit příklad v prohlížeči.

Zatím (2015) podporují jenom prohlížeče postavené na jádru Webkit (Chrome, Safari, Opera). Explorer ví, že <summary> je blokový prvek, a tak před a za summary aspoň zalomí řádek. Firefox neví ani to.

Tag <details> má atribut open (bez hodnoty). Pokud je tento atribut přítomný, bude celá oblast už při načtení stránky rozbalená, ale půjde sbalit.

 

Reklama

www.webhosting-c4.cz, webhosting s doménou v ceně. 20GB
o tvorbě, údržbě a zlepšování internetových stránek

Návody HTML CSS JavaScript Články Ostatní

HTML tagy Abecedně Příklady HTML tahák

Jak psát web píše Yuhů, Dušan Janovský. Kontakt.