docHTML Hypertext Markup Language • je jazyk určený na publikování
download 
Stížnost Transkript
HTML Hypertext Markup Language • je jazyk určený na publikování
HTML Hypertext Markup Language • je jazyk určený na publikování a distribuci dokumentů na Webu • velmi jednoduchý jazyk − používá ho mnoho uživatelů • má výkonné prostředky (příkazy) k formátování dokumentů (různé typy a velikosti písma − hlavičky, seznamy, tabulky, rámy (dělení stránky, ?) • umožňuje vytvářet hypertextové odkazy na jiné Web stránky (na jiném Web serveru) • umožňuje vkládat na Web stránky multimediální soubory (prezentace) − obrázky (mohou být hypertextovým odkazem na další Web stránky), animace, audio, video • umožňuje interakci s uživatelem pomocí formulářů Formulář má ve skutečnosti dvě složky: − HTML (Web) stránku definující formulář. Ta představuje „viditelnou“ část a zajišťuje styk s uživatelem − když prohlížeč získá Web stránku, která obsahuje formulář, zobrazí jej uživateli a umožní mu prostřednictvím nejrůznějších vstupních polí a tlačítek zadat požadované informace. − „Obslužný“ skript − když se odešle vyplněný formulář, prohlížeč pošle serveru URL (adresu) obslužného skriptu a předá mu uživatelovy informace z adresáře. Skript je převezme, provede s nimi (na serveru), co je zapotřebí a vytvoří HTML stránku, obsahující odezvu na zaslané informace. Ta je pak uživateli prohlížečem zobrazena jako výsledek formuláře. Vývoj HTML Klán, P., Jindřich, J. WWW pro zelenáče. Neokortex 2002 Softwarové noviny //2003 − Dočkáme sa očisty HTML − 90 léta − široké použití jazyka HTML pro publikování a distribuci dokumentů, rozšiřování a modifikace původního návrhu jazyka HTML − 1997 − snaha o standardizaci (konsorcium W3C) HTML 3.2 Reference Specifications − 1997 − verze HTML 4.0 − 1999 − verze 4.01 − vývoj HTML je ukončen − 1998 − nástup „jazyka“ XML (Extensible Markup Language) − rozšířit možnosti zpracování dat na Webu nad rámec toho, co umožňuje HTML. XML − metajazyk − uživatel má možnost si sám definovat vlastní značky; soubor pravidel, pomocí kterých je možné navrhnout konkrétní aplikační jazyk. − 2000 − Konsorcium W3C zveřejňuje doporučení • XML 1.0 • XHTML 1.0 − (Extensible Hypertext Markup Language) A Reformulation HTML 4 in XML 1.0 − značky v XHTML jsou shodné (až na malé výjimky) se značkami v HTML 4 − používá se syntax jazyka XML − XHTML = HTML + XML (jazyk XHTML využívá výhody XML i HTML) Rozdíly mezi HTML a XHTML • všechny značky musí být psány malými písmeny např. <table>, <br />, ... • všechny značky musí být ukončeny (každá počáteční značka musí mít koncovou značku) − u párových značek <h1>Rozdíly mezi HTML a XHTML</h1> <p>text</p> − u nepárových značek − značka musí být ukončena /> <br /> <img src=”logo.gif” width=“200” height=”200” alt=”znak” /> − hodnoty atributů značek musí být v uvozovkách <a href=”http://dfjp.upce.cz/akreditace“>Akreditace</a> − vnoření značek se nesmí křížit <strong><h1>XHTML</h1><strong> Pevná struktura XHTML dokumentu <?xml version="1.0" encoding=“windows-1250"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm11-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head > <title> Výuka XHTML </title> <meta http-equiv="Content-Type" content="text/html"; charset="windows-1250"> </head> <body> <strong> <h1 align=“center“ >XHTML</h1></strong> <p><strong><h2 >Struktura XHTML dokumentu</h2></strong></p> <p><h3>Základy formátování textu</h3></p> <p> </p> <hr /> </body> </html> • <?xml version="1.0" encoding=“windows-1250"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm11- Transitional.dtd"> − tzv. preambule deklarace verze XML, kódování − nepovinný řádek DTD − typ dokumentu (obsahuje seznam všech prvků a atributů, které je možné v dané verzi XHTML použít − jazyk XHTML 1.0 definuje tři typy dokumentů: − Strict (přesné) − nepodporuje tzv. zapovězené značky a rámy, k formátování písma vyžaduje kaskádové styly − − Transitional (přechodné) − umožňuje snadný přechod od HTML dokumentů k XHTML − podporuje tzv. zapovězené značky, nepodporuje rámy, nevyžaduje kaskádové styly Frameset (rámcové) − jde o přechodný typ rozšířený o možnost použití rámců • <html xmlns="http://www.w3.org/1999/xhtml"> − začátek XHTML dokumentu − atribut xmlns specifikuje tzv. jmenný prostor (namespaces) − jedná se o názvy všech použitelných značek a jejich atributů založený na HTML 4.01. − Podobně </html> ukončuje XHTML dokument • <head > <title> Výuka XHTML </title> <meta http-equiv="Content-Type" content="text/html" charset="windows-1250" /> </head> − hlavička dokumentu − další informace k dokumentu, titulek (popisek) stránky (title), kódování (pro starší prohlížeče) • <body> <strong> <h1 align=“center“ >XHTML</h1></strong> <p><strong><h2 >Struktura XHTML dokumentu </h2></strong> </p> <p><h3>Základy formátování textu</h3></p> <p> </p> <hr /> Tělo XHTML dokumentu − vkládá se sem obsah stránky, která má být vidět v prohlížeči </body> </html> Soubor s XHTML dokumentem má příponu htm resp. html. Tvorba jednoduchého XHTML dokumentu • formátování písma − typ zobrazovaného písma se nastavuje v prohlížeči Web stránek − můžeme nastavit zvýraznění textu (značky udávají zvýraznění přímo prohlížeči) <b>Tučné písmo</b> <i>Kurzíva</i> jejich kombinace (vnoření) a další − logické zvýraznění textu (zvýraznění je závislé na prohlížeči) <em> </em> − většinou výsledkem je kurzíva <strong> </strong> − tučné zvýraznění − nadpisy <h1> (nejdůležitější) až <h6> (nejméně důležitý) − dolní <sub> a horní <sup> index − velikost, barva a typ písma − značka <font> s atributy size, color, face <font size=”7” color=”blue” face=”Arial”>Dobrý den</font> • odstavce a zarovnání textu − atribut align a jeho hodnoty left, right, center, justify <h1 align=”center”>Tvorba WWW stránek</h1> − značka <div> pro zarovnání více odstavců zároveň <div align=”center”> <p>XHTML</p> <p>Tvorba WWW stránek</p> <p>Zarovnání textu</p> </div> − zalomení řádku <br /> − pevná mezera • seznamy − nečíslovaný seznam <UL> (odrážky), atribut type udává tvar odrážky (hodnoty „disc“, „circle“, „square“) − číslovaný seznam <OL>, atribut type udává způsob číslování (hodnoty 1, I, i, A, a) − položky seznamu <li> − vnořené seznamy • odkazy <a href=”http://ct.upce.cz/machalik/inf_II“>Informatika II</a> • obrázky • tabulky <table> <tr> <td>prvek 11</td> <td>prvek 12</td> <td>prvek 12</td> </tr> <tr> ............. </tr> </table> • rámy ? • formuláře a jejich obsluha
