Rozvržení stránky prvky div
Rozvržení stránky mřížkou
Formulář
můj
Webová stránka je informační dokument, který se zobrazuje v aplikaci zvané webový klient (Firefox, Chrome, Opera, Explorer, ...). Dokument je psaný ve značkovacím jazyce HTML a kromě textu a obrázků obsahuje také odkazy na jiné dokumenty. Webový klient tento dokument získá od webového serveru (apache, iis, ...), který trvale běží na nějaké adrese v Internetu.
Celý html dokument je uzavřen do párového tagu <html>.
Skládá se z hlavičky a těla. V hlavičce jsou uvedeny různé informace o stránce,
např. kdo stránku vytvořil, jeké používá kódování českých znaků, jaká jsou na stránce
klíčová slova pro internetové vyhledávače apod.
Tělo určuje obsah dokumentu, který je rozdělen do odstavců textu a ty jsou
nadepsány nadpisy. Nadpisy mají různé úrovně, nadpis nejvyšší úrovně se zpravidla
na stránce vyskytuje jen jednou na začátku. Úrovní nadpisů může být až šest.
| <html> | P | ohraničuje html dokument |
| <head> | P | hlavička dokumentu |
| <body> | P | tělo dokumentu |
| <p> | P | odstavec |
| <br> | N | tvrdé odřádkování |
Pokud potřebujeme uspořádat text do řádků a sloupců, můžeme použít HTML tabulku - viz. výše. Jiný způsob uspořádání textu je tzv. "předformátovaný text":
značka význam -------------------------------------------------------- ><html> párová ohraničuje html dokument ><head> párová hlavička dokumentu ><body> párová tělo dokumentu --------------------------------------------------------
Pro tvorbu odkazů je potřeba použití krátkého kousku HTML kódu. Přidat "href", který označuje destinaci daného linku. Pokud daný odkaz je na vnější webové stránce, tak je potřeba v kódu použít celé URL (obvykle začíná s "http"). Pokud se uvede jenom jméno dané stránky, tak aktuální odkaz bude fungovat jako hlavní adresář (tzv. parent directory) i pro daný odkaz.
Odkaz na portál seznam.cz
Odkaz na jeden článek na seznamu.
Odkaz na pokusný dokument (je ve stejné složce)
Odkaz na dlooooouhý dokument
odkaz na 1.kapitolu dlouhataaaaaaaaaanského dokumentu
odkaz na 5.kapitolu dlouhataaaaaaaaaanského dokumentu
Tento dokument se otevře v novém okně/nové kartě
Tento dokument se otevře v novém okně jménem "Venca"
Tento dokument se otevře v novém okně/nové kartě
Tento dokument se otevře v novém okně jménem "Venca"
Tady svými slovy...
Etiam dictum tincidunt diam. In rutrum. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Etiam quis quam. Integer malesuada. Mauris dolor felis, sagittis at, luctus sed, aliquam non, tellus. Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. In sem justo, commodo ut, suscipit at, pharetra vitae, orci. Proin in tellus sit amet nibh dignissim sagittis. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean id metus id velit ullamcorper pulvinar. 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. Maecenas sollicitudin. Integer pellentesque quam vel velit. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Integer malesuada. Sed ac dolor sit amet purus malesuada congue. Proin mattis lacinia justo. Mauris dolor felis, sagittis at, luctus sed, aliquam non, tellus.
Morbi leo mi, nonummy eget tristique non, rhoncus non leo. Phasellus et lorem id felis nonummy placerat. In enim a arcu imperdiet malesuada. Phasellus et lorem id felis nonummy placerat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam sapien elit, consequat eget, tristique non, venenatis quis, ante. Aenean id metus id velit ullamcorper pulvinar. Integer pellentesque quam vel velit. Cras pede libero, dapibus nec, pretium sit amet, tempor quis. In laoreet, magna id viverra tincidunt, sem odio bibendum justo, vel imperdiet sapien wisi sed libero. Fusce consectetuer risus a nunc.
Etiam sapien elit, consequat eget, tristique non, venenatis quis, ante. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse nisl. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Praesent vitae arcu tempor neque lacinia pretium. Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. Mauris metus. Phasellus faucibus molestie nisl. Vivamus porttitor turpis ac leo. Nullam feugiat, turpis at pulvinar vulputate, erat libero tristique tellus, nec bibendum odio risus sit amet ante. Pellentesque ipsum. Maecenas aliquet accumsan leo. Sed vel lectus. Donec odio tempus molestie, porttitor ut, iaculis quis, sem. Etiam quis quam. Phasellus faucibus molestie nisl. Etiam neque. Quisque tincidunt scelerisque libero. Integer vulputate sem a nibh rutrum consequat.
Maecenas libero. Aliquam erat volutpat. Phasellus rhoncus. In convallis. Sed convallis magna eu sem. Integer in sapien. Nullam justo enim, consectetuer nec, ullamcorper ac, vestibulum in, elit. Donec vitae arcu. In rutrum. Phasellus et lorem id felis nonummy placerat. In rutrum. Maecenas lorem. Sed vel lectus. Donec odio tempus molestie, porttitor ut, iaculis quis, sem. Aliquam ante. Nullam sapien sem, ornare ac, nonummy non, lobortis a enim.
