příklady

Rozvržení stránky pomocí bloků div
Rozvržení stránky pomocí mřížky
Webový formulářVlastní stránka

IKT - tvorba webových stránek

Základy

Co je to vebová stránka?

Webová stránka je informační dokument, který se zobrazuje v aplikaci webový klient (Firefox, Chrome, Opera, Explorer, elinks, ...). Webové stránky spravuje webový server (apache, iis, ...) umístěný na nějaké adrese v Internetu a tyto stránky odesílá klientům, poté, co o ně požádají.

Struktura HTML dokumentu

Struktura HTML dokumentu je definována hlavičkou(začátkem) a tělem(obsahem stránky). Hlavička,která není zobrazována obsahuje další informace a zbytek dokumentu je uložen v těle.

Význam HTML značek

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

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

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

ZNAČKA               VÝZNAM
=================================================
html      párová     oraničuje celý HTML dokument
head      párová     hlavička
=================================================

Odkazy

Jak vytvořit odkaz

Odkaz je tvořen párovým tagem "a" a musí obsahovat "href",který obsahuje adresu, která určuje polohu a přemístění prohlížeče webových stránek. Na začátku je " ///https" a poté je odkaz tvořen jménem stránky.

Příklady odkazů

Odkaz na portál seznam.cz
Odkaz na jeden článek na seznam.cz
Odkaz na pokusný dokument.
Odkaz na 12.stránka.
Tento dokument se otevře v okně/panelu jménem "Olda" Tento dokument se otevře v okně/panelu jménem "Olda"

Obrázky

Jak vložit obrázek

Uložíme si obrázek .jpg. Do naší stránky pak napíšeme <img srcE> a vložíme obrázek.

Příklady obrázků

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec vitae arcu. Mauris dolor felis, sagittis at, luctus sed, aliquam non, tellus. Aliquam in lorem sit amet leo accumsan lacinia. Morbi scelerisque luctus velit. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Nullam dapibus fermentum ipsum. Nullam sapien sem, ornare ac, nonummy non, lobortis a enim. Phasellus et lorem id felis nonummy placerat. Duis pulvinar. Cras elementum. Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur? Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. Nullam rhoncus aliquam metus. Aliquam ante. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Vivamus porttitor turpis ac leo. Praesent dapibus.

Pellentesque ipsum. Ut tempus purus at lorem. Vivamus luctus egestas leo. Praesent in mauris eu tortor porttitor accumsan. Aliquam erat volutpat. Etiam sapien elit, consequat eget, tristique non, venenatis quis, ante. Donec ipsum massa, ullamcorper in, auctor et, scelerisque sed, est. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Nullam eget nisl. Mauris suscipit, ligula sit amet pharetra semper, nibh ante cursus purus, vel sagittis velit mauris vel metus. Nam sed tellus id magna elementum tincidunt. 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. Nullam lectus justo, vulputate eget mollis sed, tempor sed magna. Suspendisse nisl. Donec ipsum massa, ullamcorper in, auctor et, scelerisque sed, est. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

In enim a arcu imperdiet malesuada. Sed elit dui, pellentesque a, faucibus vel, interdum nec, diam. Fusce tellus odio, dapibus id fermentum quis, suscipit id erat. Aliquam erat volutpat. Etiam sapien elit, consequat eget, tristique non, venenatis quis, ante. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla non arcu lacinia neque faucibus fringilla. Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. Integer lacinia. Nulla non arcu lacinia neque faucibus fringilla. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam dictum tincidunt diam. Phasellus enim erat, vestibulum vel, aliquam a, posuere eu, velit. Donec ipsum massa, ullamcorper in, auctor et, scelerisque sed, est. Integer pellentesque quam vel velit. Nullam faucibus mi quis velit. Sed ac dolor sit amet purus malesuada congue. Morbi scelerisque luctus velit.