Tvorba WWW stránek. Mgr. Petr Jakubec. Katedra fyzikální chemie Univerzita Palackého v Olomouci Tř. 17. listopadu

Rozměr: px

Začít zobrazení ze stránky:

Download "Tvorba WWW stránek. Mgr. Petr Jakubec. Katedra fyzikální chemie Univerzita Palackého v Olomouci Tř. 17. listopadu"

Růžena Krausová
před 7 lety
Počet zobrazení:

1 Tvorba WWW stránek (čtvrtá hodina) Mgr. Petr Jakubec Katedra fyzikální chemie Univerzita Palackého v Olomouci Tř. 17. listopadu 12 Čtvrtá hodina 1 / 12

2 1 Tvorba statických WWW stránek za využití prostředků jazyka HTML Formátovací tagy Formátovací tagy Formátovací tagy Obrázky v HTML Tabulky v HTML <table> a jeho parametry Tag <tr> Tagy <td> a <th> Hypertextové odkazy Bonus Čtvrtá hodina 2 / 12

3 Forma tovacı tagy Znac ka <b>... </b> <i>... </i> <u>... </u> <tt>... </tt> <small>... </small> <big>... </big> <sub>... </sub> <sup>... </sup> <font>... </font> <basefont>... </basefont> <div>... </div> Vy znam Tuc ne pı smo. Kurzı va. Podtrz ene Neproporciona lnı pı smo. Pı smo o bod mens ı. Pı smo o bod ve ts ı. Dolnı index. Hornı index. Definuje zme ny vlastnostı pı sma oproti standardnı mu nastavenı pro pr ı slus nou c a st HTML dokumentu. zme na vlastnostı pı sma textu v cele m dokumentu Me nı zarovna nı a barvu textu uzavr ene ho mezi znac kami. Atributy size=hodnota color=hodnota name=r ete zec size=hodnota align color <pre>... </pre> Prohlı z ec ponecha va forma tova nı z pu vodnı ho dokumentu. textu 3 / 12

4 Forma tovacı tagy Znac ka <p>... </p> <h>... </h> <br> <hr> Vy znam Forma lnı a fyzicke rozde lenı textu na odstavce. Forma lnı a fyzicke rozde lenı textu na nadpisy. Zalomenı r a dku graficky odde lovac <center>... </center> Centrova nı textu Atributy align size color noshade width align 4 / 12

5 Forma tovacı tagy Znac ka <cite>... </cite> <code>... </code> <var>... </var> <dfn>... </dfn> <blockquote>... </blockquote> <address>... </address> <em>... </em> <strong>... </strong> Vy znam oznac enı citovane c a sti textu syntaxe zdrojovy ch ko du syntaxe zdrojovy ch ko du vyznac enı pojmu pro rejstr ı k vyznac enı dlouhe citace oznac enı adresy kurziva tuc ny font Atributy 5 / 12

gif"> obra zek je zada n s celou URL i adresa r ovou adresou parametry: <img src="obr1.gif"> <img src="../gifs/obr2.

6 Obra zky v HTML obra zek umı ste ny pr ı mo v adresa r i obra zek umı ste ny v adresa r i gifs vc etne cele adresa r ove cesty <img src=" obra zek je zada n s celou URL i adresa r ovou adresou parametry: <img src="obr1.gif"> <img src="../gifs/obr2.gif"> alt="popis" align="left right top middle bottom" (v px c i %) height="hodnota" (v px) (v px) hspace="hodnota" vspace="hodnota" (prostor nad a pod v px) width="hodnota" border="hodnota" 6 / 12

7 Tabulky v HTML < table cols ="2" align =" center " bgcolor ="#66 FF33 " border ="1" > <tr > <td > Jme no </ td > < td > Bydlis te </ td > </ tr > <tr > <td > Nova k </ td > < td > Olomouc </ td > </ tr > <tr > <td > Meisner </ td > < td > Praha </ td > </ tr > </ table > 7 / 12

<table> a jeho parametry Parametr <caption> align valign cols cellspacing cellpadding bgcolor background border bordercolor width Vy znam nadpis tabulky zarovna nı tabulky vzhledem k s ı r ce stra

8 <table> a jeho parametry Parametr <caption> align valign cols cellspacing cellpadding bgcolor background border bordercolor width Vy znam nadpis tabulky zarovna nı tabulky vzhledem k s ı r ce stra nky zarovna nı textu v polı c ka ch tabulky poc et sloupcu tabulky nastavenı vzda lenosti mezi bun kami vzda lenost mezi okrajem bune k a textem barva pozadı cele tabulky obra zek na pozadı tabulky tlous t ka ra mec ku v pixelech barva ra mec ku s ı r ka tabulky v px nebo % Atributy align="left center right" align="left center right" valign="top bottom" cols="c ı slo" cellspacing="c ı slo" cellpadding="c ı slo" bgcolor="barva" background="url" border="c ı slo" bordercolor="barva" width="hodnota" 8 / 12

9 Tag <tr> Parametr align valign bgcolor background border bordercolor nowrap Vy znam zarovna nı tabulky vzhledem k s ı r ce stra nky zarovna nı textu v polı c ka ch tabulky barva pozadı r a dku obra zek na pozadı tabulky tlous t ka ra mec ku v pixelech barva ra mec ku jednotlivy ch bune k v r a dku nezalamova ni textu v tabulce Atributy align="left center right" valign="top bottom middle" bgcolor="barva" background="url" border="c ı slo" bordercolor="barva" 9 / 12

Tagy <td> a <th> <th> pro bun ku ve funkci za hlavı <td> pro norma lnı bun ku tabulky Parametr align valign nowrap bgcolor background border bordercolor width colspan rowspan Vy znam zarovna nı

10 Tagy <td> a <th> <th> pro bun ku ve funkci za hlavı <td> pro norma lnı bun ku tabulky Parametr align valign nowrap bgcolor background border bordercolor width colspan rowspan Vy znam zarovna nı tabulky vzhledem k s ı r ce stra nky zarovna nı textu v polı c ka ch tabulky nezalamova ni textu v tabulce barva pozadı r a dku obra zek na pozadı tabulky tlous t ka ra mec ku v pixelech barva ra mec ku jednotlivy ch bune k v r a dku s ı r ka tabulky v px nebo % spojenı bune k lez ı cı ch vedle sebe spojenı bune k ve sloupcı ch Atributy align="left center right" valign="top bottom middle" bgcolor="barva" background="url" border="c ı slo" bordercolor="barva" width="hodnota" colspan="hodnota" rowspan="hodnota" 10 / 12

11 Hypertextove odkazy tag <a> anchor (kotva), tj. tag odkazujı cı na jiny soubor pr ı klady pouz itı : 1 <a href=" najdu tam co nezna m</a> 2 <a href="./bla/blabla/index.html">nejaka blbost</a> 3 <a name="r ete zec">...</a> Odkaz na <a href ="# strana3 " > stranu c. 3 </a > ( probı ha ne kolik stran textu )... <a name ="# strana3 " > </a > ( text pokrac uje na tr etı strane ) 11 / 12

12 text zarovnaný na střed nadpis první úrovně barva pozadí: #FFCC00 hypertextový odkaz na wiki text formátovaný pomocí tabulky copyright + validace WWW obrázek zarovnaný na střed + kombinace hypertextu na wiki 12 / 12

Podobné dokumenty

Tvorba WWW stránek. Mgr. Petr Jakubec. Katedra fyzikální chemie Univerzita Palackého v Olomouci Tř. 17. listopadu

Tvorba WWW stránek. Mgr. Petr Jakubec. Katedra fyzikální chemie Univerzita Palackého v Olomouci Tř. 17. listopadu Tvorba WWW stránek (třetí hodina) Mgr. Petr Jakubec Katedra fyzikální chemie Univerzita Palackého v Olomouci Tř. 17. listopadu 12 Třetí hodina 1 / 14 1 Základní struktura WWW stránek Standard jazyka HTML