Home Cryptocurency ExchangesHTML příručka, přehled HTML tagů
HTML příručka, přehled HTML tagů

HTML příručka, přehled HTML tagů

Popis HTML tagů a jejich atributů, jak jsou podporovány hlavními prohlížeči
Internet Explorer, Chrome, Firefox aj. v roce 2017 (průběžně aktualizováno od
2001). Manuál nepíšu podle html reference nebo specifikace, ale ze zkušeností
(odpovídá to podporované kombinaci HTML 4.01 a HTML 5).

Jste úplní začátečníci? Napřed si přečtěte, jak
si udělat stránky
a jak stránky dostat na
server
. Příklady najdete v HTML taháku,
nebo mrkněte na nejužitečnější tagy.

Přehled HTML značek (tagů)

Jednotlivé tagy popisuji v těchto kapitolách:

StrukturaText
BlokySeznamy
OdkazyObrázky
Klikací mapy
TabulkyRámy
ObjektyFormuláře
HlavičkaSkripty a styly
Rozšíření –
Strukturní tagy z HTML 5

Jazyk HTML

Syntaxe

co se jak v HTML píše, uvozovky,
mezery, tagy

Terminologie
čemu se jak v HTML říká

URL – zápis webových adres, příklad, rozbor

Barvy – základní zápis barev v HTML

Délky – HTML zná pouze pixely, procenta
a stupně písma

Znakové entity – značky, které mají v HTML
speciální význam, nebo speciální znaky se píšou &entitami;

Nejdůležitější tagy – vhodné pro
začátečníky, kteří nepotřebují umět všechno

Obecné atributy – bublinové
nápovědy, označení jazyka apod.

XHTML – rozdíly syntaxe HTML a XHTML

Verze HTML – nedůležité
historické povídání

Rejstřík tagů – abecedně řazená tabulka
HTML tagů

HTML tahák – příklad nejčastějších zápisů

Podmíněné komentáře – zvláštní
poznámky pro Internet Explorer

HTML 5 – co už se dá z HTML 5 pomalu používat

zobrazit vysvětlení

Níže následuje podrobný rozpis HTML tagů spíše pro
pokročilé:

Struktura dokumentu

Každý HTML soubor by měl obsahovat několik základních tagů hlavičky a těla.
Tím se zaručí, že všichni klienti (zejm. prohlížeče) pochopí, o co v
dokumentu vlastně jde.

tag Význam Párový Výskyt
html začátek HTML dokumentu ano na začátku souboru
head hlavička stránky ano na začátku souboru
body tělo stránky + definice pozadí ano za
poznámka ano kdekoliv 
!doctype specifikace DTD ne úplně na začátku souboru

Úprava textu

Zastaralý způsob úpravy HTML textu se orientuje podle vzhledu, tomu říkám
fyzické formátování. Fyzické formátování říká například textu, že bude
tučný, namísto aby řekl, že je to důležitý text. Vyznačení smyslu HTML textu
je naopak formátování logické.

Fyzické formátování

tag Význam Párový Používat?
b tučné písmo ano ano
i kurzíva ano ano
u podtržení textu ano ne
sub dolní index ano ano
sup horní index ano ano
small zmenšení textu ano  
big zvětšení písma ano  
s přeškrtnutý text ano  ne
strike přeškrtnutý text ano  
font písmo ano ne
basefont základní font ne ne
blink blikání písma ano ne
mark vyznačení v citaci ano ?
ruby anotace nad textem ano ?
nobr nezalamovat obsah ano  
wbr volitelné rozdělení ne klidně

Logické formátování

tag Význam Párový Obvyklý vzhled
span úsek textu ano normální
strong zvýraznění (tučně) ano tučné
em zvýraznění (kurzíva) ano kurzíva
cite citace ano kurzíva
code výpis kódu ano strojopis
dfn nově použitý termín ano kurzíva
kbd vstup z klávesnice ano strojopis
samp ukázka ano strojopis
tt teletype ano strojopis
var formátování proměnné ano kurzíva
abbr ustálený výraz ano normální
acronym zkratka ano normální
del smazaný obsah ano přeškrtnuto
ins přidaný text ano podtrženo
q citace ano normální

Bloky

Do přehledu bloků jsem kromě blokových prvků zahrnul všechny HTML tagy, které
způsobí zalomení řádky (kromě tabulek a seznamů). Tato skupina tagů je tím
pádem poněkud umělá, ale HTML tagy
a


se mi prostě jinam nevešly.

tag Význam Párový
p odstavec nepovinně
br řádkový zlom ne
div oddíl ano
center vycentrování ano
h1 nadpis 1. úrovně ano
h2 nadpis 2 úrovně ano
h3 nadpis 3. úrovně ano
h4 nadpis 4. úrovně ano
h5 nadpis 5. úrovně ano
h6 nadpis 6. úrovně ano
blockquote citace, odsazení ano
address adresa ano
pre předformátovaný text ano
hr vodorovná čára ne

Další blokové tagy přineslo HTML 5.

tag Význam Párový
header záhlaví stránky ve smyslu viditelné hlavičky ano
footer patička stránky ano
main hlavní obsah stránky ano
article jeden článek, zejména pro situaci, kdy je na stránce článků víc ano
aside vedlejší obsah ano
section obsahová sekce, například kapitoly článku ano
nav navigace stránky ano
figure obalení obrázku nebo jiného obsahu s jeho souvisejícím obsahem ano
figcaption nadpis tagu figure ano

Seznamy

Říká se tomu také odrážky a číslování. HTML zná také definiční výčty, které
se používají velmi málo.

tag Význam Párový Výskyt
li položka seznamu nepovinně
    ,

      nebo
ol číslovaný seznam ano  
ul odrážkový seznam ano  
dir zvláštní druh seznamu ano  
menu typ seznamu ano  
dl seznam definic ano  
dt definovaný termín ano
dd definice termínu ano

Odkazy

Odkaz se v HTML dělá tagem . Mohly by sem patřit také HTML značky

a

, které uvádím u klikacích map.

tag Význam Párový Výskyt
a odkaz, hyperlink, záložka ano kdekoliv kromě

Příklad: Seznam

Obrázky

tag Význam Párový Výskyt
img obrázek ne kdekoliv
picture kontejner pro obrázek ano kdekoliv

Klikací mapy

Dnes už skoro zapomenutá možnost proměnit různé části obrázku v aktivní
oblasti, které se chovají jako odkaz.

tag Význam Párový Výskyt
map klikací mapa ano  
area oblast v klikací mapě ne

Tabulky

Tabulky jsou v HTML na strukturované zobrazování dat, používají se ale i na
celkové rozvržení stránky (což je zastaralé). Podstatné jsou pouze tagy

,

a

.

tag Význam Párový Výskyt
table tabulka ano  
tr řádek tabulky nepovinně ,

,

,

td buňka tabulky nepovinně
th hlavičková buňka tabulky nepovinně
caption hlavička tabulky ano
col ovlivnění sloupce tabulky ne
colgroup skupina sloupců tabulky ne
tbody tělo tabulky ano
thead hlavička tabulky ano
tfoot patička tabulky ano

Multimedia

V HTML5 se konečně urodily tagy, kterými se dá do stránek dobře vkládat audio
a video.

Tag Význam Párový
video obálka navzájem alternativních video souborů ano
audio obálka navzájem alternativních audio souborů ano
source možný zdroj audia, videa nebo obrázku ne
track další stopy, typicky titulky ne

Rámy

Rámy dokážou rozdělit okno prohlížeče na několik obdélníkových částí (rámů) a
v každém z nich zobrazit jinou html stránku.

tag Význam Párový Výskyt
frameset skupina rámů ano za
frame rám ne
noframes alternativa rámů ano
iframe vložený rám ano  

Objekty

Vkládání videí, animací, her, zvuků, reklam a podobných blbostí.

tag Význam Párový Výskyt
applet Java aplet ano  
object objekt ano  
param parametry objektu ne ,
embed objekt s plužinou asi  
noembed alternativa k embed ano

Formuláře

HTML dokáže na stránce vykreslit krásné formuláře. Na zpracování vyplněných
dat ale HTML žádný nástroj nemá, musejí se použít
serverové skripty.

tag Význam Párový Výskyt
form formulář ano  
input vstupní pole ne
select výběrové pole ano
option volba ne ,
textarea velké vstupní pole ano
label popis pole ano
fieldset skupina polí ano
optgroup skupina voleb ano
legend popis pole ano
button tlačítko ano
datalist data našeptávače ano  

Hlavička

HTML hlavička (tag ) obsahuje tagy, jejichž obsah se na stránce
nezobrazí, ale jsou důležité.

tag Význam Párový Výskyt
title titulek stránky ano
base základ odkazů ne
link nezobrazovaný odkaz ano
meta informace o dokumentu ne

Skripty a styly

Skripty myslím zejm. javascript, který
umožňuje ve stránkách provádět jednoduché programy. Styly jsou
CSS styly, klíčový jazyk pro ovlivnění
vzhledu HTML dokumentů.

tag Význam Párový Výskyt
script skript, program ano kdekoliv
noscript alternativa ke skriptu ano vně skriptu
style zápis CSS stylu ano
template poznámka, která se parsuje ano kdekoli

Rozšíření

Sem dávám tagy, které jsou velmi staré nebo velmi nové, takže mají neúplnou
podporu.

tag Význam Párový Podpora
bgsound zvuk na pozadí ano Internet Explorer
marquee běžící text ano Internet Explorer
canvas kreslení javascriptem ano všude
svg vektorová grafika ano všude
details a summary skrývatelná oblast ano zatím jen Webkit

Obecné atributy

Atributy použitelné u skoro každého HTML tagu.

Atribut Význam Platnost pro
class třída pro CSS selekci všechny HTML prvky
id identifikátor pro CSS a skripty všechny HTML prvky
style zápis CSS stylu zobrazované prvky
title titulek prvku, doplňující info v bublině všechny HTML prvky
lang jazyk prvku všechny HTML prvky
name jméno pro spolupráci s dalšími prvky různá použitelnost
accesskey funkční klávesa odkazy a formulářová pole
tabindex pořadí aktivizace tabulátorem odkazy a formulářová pole
události uživatelské události spouštějící skripty zobrazované prvky

O HTML

HTML znamená Hypertext Markup Language, tedy hypertextový značkovací jazyk.
Hypertext markup language se vyvinul ze SGML a stal se používaným jazykem pro
tvorbu webových stránek. V historii se nejvíce používaly
verze HTML 2.0, HTML 3.2, HTML 4.01 a HTML 5. Z HTML se
vyvinulo také XHTML (extended hypertext markup
language) jako aplikace XML, které osobně považuji za slepou vývojovou větev
(vývoj mi dal za pravdu). V
roce 2010 se začalo mluvit o používání HTML 5 a větší část jeho novinek už se v
roce 2017 používá.

Normálnímu člověku i pokročilému programátorovi stačí k životu používat
nějakou směs oblíbených HTML tagů, které jsou
všemi moderními prohlížeči podporovány, bez ohledu na to, do které verze patří.

Prosím o odkaz

Přidejte, prosím, na své stránky odkaz

HTML
příručka

nebo ikonku:

HTML příručkaikona HTML příručky

Další ikonky. Díky!

Tak to bychom měli. Možná budou někde chyby, dělal jsem to narychlo. I tak
jsem na tom nechal šest dnů. Dokončeno 1. června 2001. Stále průběžně
aktualizováno, takže těch dnů už byly desítky.

Source

Leave a Reply

Your email address will not be published. Required fields are marked *

Human Verification: In order to verify that you are a human and not a spam bot, please enter the answer into the following box below based on the instructions contained in the graphic.