Jedná se o nepovinný párový tag, většina prohlížečů si ho domyslí. Pokud ale chcete mít soubory v souladu s normou, tag používejte. Uvádí se na začátku a konci souboru.
Párová tag uvozující tělo dokumentu. Obsahuje veškerý zobrazovaný obsah stránky.Nrjpoužívanější parametry tagu body : bgcolor="yellow" nastavý barvu pozadí stránky (barva pozadí se uvádí anglicky) background="obrazek.gif" vloží do pozadí obrázek ze souboru obrazek.gif, který musí být umístěn ve stejné složce jako stránka text="blue" nastaví barvu textu link="green" nastaví barvu hypertextového odkazu
Titulek stránky
Titulek stránky. Párový tag. Mezi značkami
a je text, který bude chápán jako titulek. Titulek má několik málo známých funkcí, například: ●
zobrazuje se v záhlaví okna a na hlavním panelu jako nadpis aplikace
●
zobrazuje se jako nadpis ve vyhledávačích
●
je prioritní při indexování stránky vyhledávacími roboty
Odstavec
Párový tag ohraničující odstavec s následujícími parametry:
zarovná odstavec doprava
zarovná odstavec doleva
zarovná odstavec na střed
zarovná odstavec dobloku
Formátování textu
Př.: Ahoj Nastaví barvu písma na červenou, typ na Arial a velikost na maximum. Velikost písma může být v rozsahu 1 až 7
odřádkuje
Vložení obrázku Příklad vložení obrázku strom.gif, který se nachází ve stejném adresáři jako váš web: alt zástupný text. Zobrazuje se ve stránce v oblasti nenačteného obrázku.
Velikost obrázku
Width, height Šířka (width) a výška (height) obrázku. Udává se v pixelech nebo procentech. Pokud rozměry nejsou uvedeny, zobrazí se obrázek ve své normální velikosti. V praxi se doporučuje výšku a šířku u obrázku zadávat i v případě, že obrázek bude přirozeně veliký. To kvůli rychlejšímu a lepšímu načítání stránky.Pokud se zadají jiné rozměry, než má obrázek ve skutečnosti, pak se ve výsledku obrázek zvětší, zmenší nebo zdeformuje. V případě, že je uveden jenom jeden rozměr (šířka nebo výška), upraví se druhý rozměr tak, aby obrázek zachovával proporce (takže může být jinak velký, ale nebude deformovaný).
Zarovnání obrázku Hodnota parametru align určuje způsob zarovnání: left – vlevo, right – vpravo, center – na střed
Hypertextový odkaz Vše, co je mezi značkami a bude sloužit jako hypertextový odkaz. Např. Seznam Vytvoří ze slova „Seznam“ hypertextový odkaz na www.seznam.cz.
Cíl hypertextového odkazu v novém okně Př. Seznam Parametr target s hodnotou _balnk zajistí otevření cíle hypertextového odkazu v novém okně.
Záložka a hypertextový odkaz Tag může sloužit kromě odkazu i jako záložka. Záložka je dobrá k tomu, že definuje místo v dokumentu, na které může mířit odkaz (jiný tag s href="#jmenoZalozky"). Po kliknutí na takový odkaz se stránka odroluje na pozici záložky. Tag definující záložku obsahuje pouze atribut name. Příklad: Po kliknutí na tento odkaz odroluje stránka na místo kde je umístěna záložka priklad.
Hypertextový odkaz z části obrázku Nejprve se musí definovat část obrázku, která bude fungovat jako hypertextový odkaz. Např.: <map name="ctverecek"> <area href="prvni.htm" shape="rect" coords="80, 80, 130, 130"> Příklad ukazuje definování tzv. klikací mapy pojmenované „ctverecek“. Tvar oblasti hypertextového odkazu je definován hodnotou atributu shape (rect – obdelníková oblast, circle – kruh, polygon – mnohoúhelník). Pomocí hodnoty atributu coords určíme souřadnice dané oblasti (levý horní roh obrázku má souřadnice x=0, y=0). Pro obdelníkovou oblast se zadávají souřadnice levého horního rohu a pravého dolního rohu oblasti. Pro kruhovou oblast se zadávají souřadnice středu a poloměr. Pro mnohoúhelník se zadávají souřadnice jednotlivých vrcholů.Vše v pixelech. Po definování klikací mapy ji musíme přiřadit obrázku: Přiřazení příslušné klikací mapy zajišťuje atribut usemap.
Rámy Postup vytvoření stránky obsahující rámy: 1. Vytvoříme stránky, které budou tvořit jednotlivé oblasti stránky s rámy(menu, hlavní stránka). 2. Vytvoříme spouštěcí stránku(většinou pojmenovanou index.htm), která bude obsahovat:
Parametry tagu frameset: cols - rozdělení stránky do sloupcových rámů, 150 šířka 1. sloupce zadaná v pixelech, * - šířka 2. sloupce zbytek okna. rows - rozdělení do řádkových rámů border - šířka rámečku mezi stránkami v pixelech Parametry tagu frame: name – jméno rámu, důležité pro určení cíle odkazu v parametru target. src – zobrazovaná stránka
Vytvoření animované nabídky Postup jak vytvořit menu, které bude reagovat na umístěni ukazatele pohybu myši. Jakmile umístíme ukazatel pohybu myši na určitou položku v nabídce, tak položky změní svů vzhled. Postup: 1. Vytvoříme si například v malování obrázky, kterými bude menu tvořeno(úvod, odkazy,....). Každý obrázek je nutné uložit do složky se stránkami a to ve dvou variantách. Jednou v podobě ve které se bude zobrazovat, když na něm nebude ukazatel phybu myši a jednou v podobě jaká bude odpovídat při najetí ukazatele pohybu myši. 2. Vložíme na stránku, kde má být menu umístěno kód v JavaScriptu, který nám načte všechny obrázky, ze kterých je menu tvořeno do proměnných, čímž bude zajištěna rychlá změna obrázku. <SCRIPT language="javascript"> o1= new Image(130,23); o1.src="uvod1.jpg"; o2= new Image(130,23); o2.src="uvod2.jpg"; . . Čísla v závorce(130,23) udávají šířku a výšku obrázku v pixelech. Musí odpovídat velikosti vámi vytvořených obrázků (zjistíte např. v IrfanView).
3. Na stránku kde má být menu umístěno vložíme obrázky tvořící nabídku, vytvoříme z nich hypertextové odkazy a nadefinujeme akce pro najetí(onmouseover) a opuštění(onmouseout) ukazatele myši.
Při najetí ukazatele pohybu myši na obrázek, se provede akce definovaná v onmouseover – zobrazí se obrázek uvod2.jpg Při opuštění obrázku se provede akce definovaná v onmouseout – zobrazí se obrázek uvod1.jpg Číslo v hranatých závorkách udává kolikátý je daný obrázek na stránce 0=první, 1=druhý, … Hodnota parametru target určuje v jaké oblasti se otevře cíl hypertextového odkazu(název rámce ve které chceme cíl hypertextového odkazu otevřít). Hodnota parametru href určuje stránku, kterou chceme po kliknutí na obrázek otevřít.
Formuláře - Vytvoření testu pomocí přepínačů a tlačítek Postup jak vytvořit tzv. zaškrtávací test, který má u každé otázky několik variant odpovědí. 1. Vložíme na stránku jednotlivé otázky s příslušnými variantami odpovědí a za ně dvě tlačítka pro vyhodnoceni a zopbrazení správných odpovědí.
Přepínače patřící k jedné otázce musí mít stejné jméno(hodnota parametru name). Každý přepínač musí mít jedinečnou hodnotu id. Hodnota parametru value u talčítek určuje text zobrazený na tlačítku. Kliknutím na tlačítko spustíme příslušnou funci, kterou musíme naprogramovat v JavaScriptu. 2. Vložíme na začátek stránky kód v JavaScriptu pro funkce spouštěné pře příslušná tlačítka. <script language="JavaScript"> function hodnot() { var chyba; chyba=0; if(document.getElementById('b1').checked==false) chyba=chyba+1; if(document.getElementById('c2').checked==false) chyba=chyba+1; alert("Počet chyb: "+chyba); } function odpovedi() { document.getElementById('b1').checked="checked"; document.getElementById('c2').checked="checked"; } Funkce hodnot spočítá a vypíše počet špatných odpovědí. V závorce musíte uvést hodnotu id přepínače se správnou odpovědí. Funkce odpovedi nám zaškrtne správné odpovědi. V závorce musíte uvést hodnotu id přepínače se správnou odpovědí.