HyperText Markup Language Autor: Jitka Rybenská HTML HyperText Markup Language
HTML Jazyk, který je základem pro vytváření www stránek Co potřebujeme k tvorbě? Jakýkoliv textový editor, např. Poznámkový blok ve Windows
Pravidla pro vytváření www stránek Stránky mají co nejmenší velikost co nejkratší doba načítání stránky Stránky zálohovat pro případ selhání serveru Používat standardní fonty (Arial, Verdana, Times New Roman, Courier, Helvetica) V názvech souborů a odkazů používat malá písmena (některé rozeznávají malá a velká písmena) Rozmyslet adresářovou strukturu, obrázky do samostatných adresářů Stránky aktualizovat.
Uložení stránek na internetu 1. možnost – freeWebHosting – stránka je umístěna na server zdarma – občas nastávají problémy při aktualizaci a změnách www.webzdarma.cz www.centrum.cz www.kgb.cz, atd. 2. možnost – placený WebHosting – snadnější úpravy + další výhody
Základy HTML Při programování se používají znaky < > Na anglické klávesnici Na české klávesnici kombinace kláves pravý ALT + < > Příkazy se nazývají tagy a píší se do < > Párový: < >…</> musí být ukončen Nepárový: < >
Kostra HTML dokumentu <HTML> … vymezuje celý dokument HTML <HEAD> … hlavička dokumentu <TITLE> titulek </TITLE> … titulek stránky </HEAD> <BODY BGCOLOR=barva nebo BACKGROUND=obrázek> tělo dokumentu (+definice pozadí), většina zdrojového kódu </BODY> </HTML> Soubor, který je titulní stránkou, se nazývá index.htm nebo default.htm
Členění textu <P> … oddělení odstavců <P>První odstavec </P><P> Druhý odstavec</P> <P>Třetí odstavec </P> Mezi slovy se zobrazuje vždy pouze jedna mezera (bez ohledu na to, kolik jich je ve zdrojovém textu) <BR> … odřádkování Text <BR> Další řádek <BR>
Formát textu <H1>…</H1> až <H6>…</H6> … nadpisy v šesti úrovních. Největší je <H1> <H1>nadpis</H1> <H2>podnadpis</H2> <P ALIGN=LEFT/CENTER> … zarovnání odstavce <HR> … vodorovná dělicí čára <HR SIZE=x WIDTH=x COLOR=brown> … tloušťka, délka, barva čáry
Formát textu <B>…</B> … tučný text <I>…</I> … kurzíva <U>…</U> … podtržené písmo <FONT SIZE=x> … velikost písma (1 až 7) <FONT STYLE=font> … druh písma (Courier, Arial,…) <FONT COLOR=#xxxxxx> … barva písma (hexadecimální hodnota) Lze psát <FONT STYLE=x SIZE=x COLOR=#xxxxxx>
Odkazy <A HREF=http://www.seznam.cz>text zobrazený na obrazovce</A> … vložení odkazu <A HREF=… TARGET=“_BLANK”>text</A> …otevření odkazu v novém okně
Vložení obrázku <IMG SRC=“jméno obrázku” ALT=“text”> … vložení obrázku, ALT zobrazí popisek obrázku
Tabulka Tabulka je jeden z nejmocnějších nástrojů HTML. Používá se velmi často pro prezentaci informací. Díky tabulkám si udržujeme kontrolu nad vzhledem stránky. Většina informací (text, obrázky, …) se prezentuje pomocí tabulek
Tabulka <TABLE> … začátek tabulky <CAPTION>název</CAPTION>…název tabulky <TR> … nový řádek <TD>…</TD> … buňka <TD>…</TD> </TR> … konec řádku </TABLE> … konec tabulky
Formát tabulky <TABLE ALIGN=CENTER WIDTH=x nebo % HEIGHT=x nebo %> … zarovnání, šířka a výška tabulky (% uvádějí š. (v.) vzhledem k monitoru) <TD WIDTH=x nebo %> … šířka buňky
Podrobnější informace S:\ZADANI\HTML\html.doc Soubor obsahující více příkazů jazyka HTML