Příklady

Dokument
Rozvržení stránky pomocí bloků div
Formulářv.1
v.2 v.3 v.4 v.5 můj

Poznámky z IKT

Bingusovy Tipy - Tvorba stránek

Co je to webová stránka?

Je soubor dat zobrazovaný uživateli webovým prohlížečem.

Struktura HTML dokumentu

Obyčejný textový soubor. Kromě vlastního textu obsahuje formátovací značky, přičemž každá má svůj význam. Mezi takové značky patří například tag <P>, který odděluje odstavce, <H1> a </H1>, které vyznačují nadpis a nebo tag <TITLE>, který vymezuje název celého dokumentu.

Význam některých HTML značek

<html>   párová   ohraničuje celý HTML dokument
<head>   párová   hlavička

značka (Ne)Párová význam
<html> P ohraničuje celý HTML dokument
<head> P hlavička
<p> P odstavec

Pokud chceme data uspořádat do řádků a sloupců, můžeme použít HTML tabulku (viz.výše). Jiný způsob uspořádání je tzv. "předformátovaný text":

značka              Význam
$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$
html    párová      ohraničůje celý html dokument
head    párová      hlavička
br    nepárová      odřádkování
$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$

Odkazy

Jak udělat odkaz?

Slouží k propojení dokumentů mezi sebou. Pro vytvoření odkazu slouží značka <a>,
která ovšem musí být také zakončena. Mezi počáteční a koncovou značkou odkazu může být cokoliv,
co odkazuje na cílovou věc, kterou chceme zobrazit. Výsledný text by mohl vypadat nějak takhle:
<a href="https://www.seznam.cz/">
Musíme si ovšem dát pozor například při odkazování na nějaký textový dokument,
který máme uložený v našem počítači. Pokud se nachází v jiné složce, než ve které máme uložený zdrojový kód naší stránky,
musíme to také v textu zmínit.

Příklady odkazů

Odkaz na stránku seznam

Odkaz na stránku zajímavý článek na seznam.cz

Odkaz na pokusný dokument. (je ve stejné slože)

Odkaz na pokusný dokument.

Odkaz na 2. Kapitolu dlooouhého dokumentu

Tento dokument se otevře v novém okně/panelu.
Tento dokument se otevře v okně/panelu jménem "milda".
Tento dokument se otevře v okně/panelu jménem "milda".

Obrázky

Jak vložit obrázek

Tady sými slovy..

Příklady obrázků

In rutrum. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat. Integer in sapien. Maecenas fermentum, sem in pharetra pellentesque, velit turpis volutpat ante, in pharetra metus odio a lectus. Nullam sit amet magna in magna gravida vehicula. Curabitur bibendum justo non orci. In sem justo, commodo ut, suscipit at, pharetra vitae, orci. Integer pellentesque quam vel velit. Nullam faucibus mi quis velit. Maecenas libero. Nunc tincidunt ante vitae massa. Nullam dapibus fermentum ipsum. Duis viverra diam non justo. Quisque tincidunt scelerisque libero. Aliquam in lorem sit amet leo accumsan lacinia. Nulla quis diam. Integer lacinia. In enim a arcu imperdiet malesuada. In convallis.

Quisque tincidunt scelerisque libero. Fusce dui leo, imperdiet in, aliquam sit amet, feugiat eu, orci. Pellentesque arcu. Maecenas lorem. Nunc tincidunt ante vitae massa. Integer in sapien. Integer pellentesque quam vel velit. Duis ante orci, molestie vitae vehicula venenatis, tincidunt ac pede. Nullam faucibus mi quis velit. Etiam dictum tincidunt diam. Fusce consectetuer risus a nunc. Aliquam erat volutpat. Quisque tincidunt scelerisque libero. Etiam bibendum elit eget erat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam id dolor. Mauris dolor felis, sagittis at, luctus sed, aliquam non, tellus.

Pellentesque arcu. Quisque porta. Nullam feugiat, turpis at pulvinar vulputate, erat libero tristique tellus, nec bibendum odio risus sit amet ante. Mauris metus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Nulla non lectus sed nisl molestie malesuada. Nullam sapien sem, ornare ac, nonummy non, lobortis a enim. Nulla pulvinar eleifend sem. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Cras elementum. Integer vulputate sem a nibh rutrum consequat. Morbi scelerisque luctus velit. Aliquam ornare wisi eu metus. Maecenas libero. Etiam posuere lacus quis dolor. Vivamus luctus egestas leo.