Titulek stránky </title
Transkript
<html> </html> 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, <html> tag používejte. Uvádí se na začátku a konci souboru. <body> </body> Párová tag uvozující tělo dokumentu. Obsahuje veškerý zobrazovaný obsah stránky.Nrjpoužívanější parametry tagu body : <body bgcolor="yellow" background="obrazek.gif" text="blue" link="green"> 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 <title> </title> Titulek stránky. Párový tag. Mezi značkami <title> a </title> 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> </p> Párový tag ohraničující odstavec s následujícími parametry: <p align="right"> zarovná odstavec doprava <p align="left"> zarovná odstavec doleva <p align="center"> zarovná odstavec na střed <p align="justify"> zarovná odstavec dobloku Formátování textu <font size= velikost color=“barva“ face=“typ písma“> </font> Př.: <font color="red" face="Arial" size=7>Ahoj</font> 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 <br> 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: <img src="strom.gif" alt="strom"> alt zástupný text. Zobrazuje se ve stránce v oblasti nenačteného obrázku. Velikost obrázku <img src="strom.gif" width="50" height="100" alt="strom"> 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 <img src="strom.gif" alt="strom" align="right"> Hodnota parametru align určuje způsob zarovnání: left – vlevo, right – vpravo, center – na střed Hypertextový odkaz <a> </a> Vše, co je mezi značkami <a> a </a> bude sloužit jako hypertextový odkaz. Např. <a href="http://www.seznam.cz">Seznam</a> Vytvoří ze slova „Seznam“ hypertextový odkaz na www.seznam.cz. Cíl hypertextového odkazu v novém okně Př. <a href="http://www.seznam.cz" target="_blank" >Seznam</a> Parametr target s hodnotou _balnk zajistí otevření cíle hypertextového odkazu v novém okně. Záložka a hypertextový odkaz Tag <a> 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 <a> s href="#jmenoZalozky"). Po kliknutí na takový odkaz se stránka odroluje na pozici záložky. Tag <a> definující záložku obsahuje pouze atribut name. Příklad: <a name="priklad"></a> <a href="#priklad">Po kliknutí na tento odkaz odroluje stránka na místo kde je umístěna záložka priklad.</a> 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"> </map> 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: <img src="obrazek.gif" usemap="#ctverecek" width="150" height="150"> 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: <frameset cols="150, *"> <frame name="sloupek" src="menu.htm"> <frame name="obsah" src="uvod.htm"> </frameset> 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"; . . </SCRIPT> Čí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. <a onmouseover="document.images[0].src='uvod2.jpg'" onmouseout="document.images[0].src='uvod1.jpg'" target="název cílového rámce" href="stánka"> <img border="0" src="uvod.jpg" width="130" height="23"> </a> 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í. <form name="otazky"> Kdo byl prvním prezidentem České republiky? <br> <input type="radio" name="o1" id="a1" > Václav Klaus <br> <input type="radio" name="o1" id="b1" > Václav Havel <br> <input type="radio" name="o1" id="c1" > Gustav Husák Kolik pater má naše škola? <br> <input type="radio" name="o2" id="a2"> 2 <br> <input type="radio" name="o2" id="b2" > 4 <br> <input type="radio" name="o2" id="c2 > 3 <input type="button" name="t1" value="zkontroluj" onclick="hodnot()"> <input type="button" name="t2" value="správné odpovědi" onclick="odpovedi()"> </form> 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"; } </script> 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í.
Podobné dokumenty
Navigace v prezentaci
tlačítko vybereme z nabídky poklepem a vložíme na vybrané místo ve snímku. S vložením
symbolu se zároveň otevře dialogové okno pro zvolení vhodné akce.
Např. symbol „domů“ pro zvolení návratu na sa...
SJCAM SJ5000 PLUS - návod
Fotografii pořídíte stiskem tlačítka OK na horní straně kamery. Z boku kamery jsou tlačítka se
šipkami, která slouží jako zoom.
Přenosné počítače
prstu. Proto touchpad nereaguje na dotykové pero nebo např. prst v rukavici, jako třeba
dotykový display, který funguje na jiném principu.
Touchpad reaguje také na poklepání prstem, díky kterému lz...
HEAD_SD
V této nabídce je mód Hledání, Hledání sítě a Rádií.
Když stisknete OK ve volbě Hledání satelitu pro zobrazení
nabídky.
Použijte tlačítka Nahoru/Dolů pro výběr položky a vyberte
její parametr tlačí...
canon ixus arancia – limitovaná serie aps fotoaparátu cz - foto-m.cz
Limitovaná edice fotoaparátu Canon Ixus Arancia na APS film (IX240).
Fotoaparát uvedeme do provozu vložení baterie CR2,pod kryt baterií.Do šachty pro film IX 240
APS vložíme kazetu s neexponovaným ...
evropská pravidla pro internetové stránky vpa
Internet se stal hlavní obchodní a komunikační sítí, která lidem v podnikání nabízí téměř neomezený potenciál
pro provádění transakcí a udržování kontaktů s ostatními.
Aby VPA mohli propagovat prod...
Elektronické publikování
Internetová adresa (http://www.seznam.cz)
Pokud potřebujeme vytvořit odkaz, který by zajišťoval stažení nějakého souboru, do URL uvedeme přesnou
adresu, kde se soubor nachází.
Více