HTML. HTML- HyperTextMarkUpLanguage (nadtextový značkový jazyk) TAGY

Podobné dokumenty
Tvorba www-stránek. Příkazy jazyka HTML. Budeme pracovat následovně: Základní struktura webové stránky. Příkazy sekce HEAD

Tvorba www v jazyku HTML

<html> - párový tag, uzavírá celý dokument <head> - párový, určuje hlavičku dokumentu <body> - párový, uzavírá tělo dokumentu Př. Základní struktura

Tvorba webových stránek

Úvod do jazyka HTML (Hypertext Markup Language)

HTML Hypertext Markup Language

Tvorba webových stránek

Zá klady HTML. Tag HTML <HTML> Párová značka, který definuje webovou stránku. Obsah stránky končí značkou

Čtvrtek 11. dubna. Základy HTML. Obecná syntaxe HTML. Struktura HTML

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

Základy HTML. Obecná syntaxe HTML. Struktura HTML

9. Tagy tvorba www stránky pomocí tagů

Tvorba webových stránek pomocí HTML kódu v příkladech. M. Seménka, 2014

Jaroslav Berédi HTML. základy

Internet 02 - Tvorba statických www stránek za pomoci HTML tagů

22. Tvorba webových stránek

Hlavička dokumentu. mezi <head> a </head> obsahuje informace vztažené k dokumentu metadata <title> - název stránky, povinná párová značka

Poznámka v (x)html Všechno, co je v (x)html souboru obaleno značkami <!-- a -->, je považováno za poznámku a nezobrazuje se.

Základy HTML. Obecná syntaxe HTML. Struktura HTML

<link> - definuje vztah k jiným XHTML dokumentům, typicky

13. Vytváření webových stránek

12. Základy HTML a formuláře v HTML

MS PowerPoint - Úvod.

Tvorba webu. Základní HTML tagy. Martin Urza

Krížovka. Hot Potatoes JCross ( červená farba) = vytvorenie krížovky, do ktorej vpisujeme odpovede na zadané otázky. Priradenie

PODPORA ELEKTRONICKÝCH FOREM VÝUKY

Tabulky. Přehled tagů z oblasti tabulek. Tag Význam Párový Výskyt. tr řádek tabulky nepovinně <table>, <tbody>, <thead>, <tfoot>

Úvod do tvorby internetových stránek v jazyce HTML

Učebné texty a pracovné listy Cvičenia z aplikovanej informatiky 4. ročník - OA

CSS Kaskádové styly. formátování webových stránek

Tvorba internetových stránek

Název DUM: VY_32_INOVACE_2B_14_ Programovací_jazyk_HTML

TNPW1 Cvičení aneta.bartuskova@uhk.cz

v laboratořích CERN ve Švýcarsku byl zahájen projekt WWW (T. Barners-Lee přichází s projektem distribuovaného hypertextového systému)

Základy informatiky. 03, HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

Ul, Ol, Li, Dl... Párové tagy Ul odrážkovy zoznam Ol číslovaný zoznam Li položka zoznamu Dl zoznam definícií

Základy informatiky. 03 HTML, tvorba webových stránek. Kačmařík/Szturcová/Děrgel/Rapant

Struktura stránek. <TITLE></TITLE>... text mezi tagy je zobrazen v názvu okna. <BODY></BODY> atributy:

Dokument ve formátu webové stránky vytvořený pomocí XHTML a CSS

Základy HTML. Autor: Palito

Základy informatiky. HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

Word textov, webových stránok, kníh, prezentácií... Pracovné prostredie: Formátovanie písma Štýly Hlavička a päta

NSWI096 - INTERNET. CSS kaskádové styly. Mgr. Petr Lasák

Jdeme tvořit webové stránky!

Soukromá střední odborná škola Frýdek-Místek, s.r.o. VY_32_INOVACE_135_IVT_HTML_08_tvorba_www

PRVKY WEBOVÝCH STRÁNOK

Obsah. 1 Úvod do Wordu Práca s dokumentmi 33. Obsah. Predhovor 1 Typografická konvencia použitá v knihe 2

Jemný úvod do HTML. Co je HTML značka? Web nezná text formátovaný mezerami a konci řádku! Ale já potřebuji psát více mezer a určovat zalomení řádku!

Inovace bakalářského studijního oboru Aplikovaná chemie

Naformátuj to. Naformátuj to. pre samoukov

Přehled základních html tagů

9. Editory www stránek II tvorba pomocí tagů a další technologie.

Tvorba stránek v HTML ve Wordu

Obrázky. Tag Význam Párový Výskyt. img obrázek ne. img video ne. map klikací mapa. area oblast v klikací mapě ne

HTML XHTML JavaScript PHP ASP.Net Zajímavé odkazy

CSS Selektory tříd a ID, dědičnost, další vlastnosti. Formátování HTML dokumentu, které je více či méně oddělené od obsahu Způsoby implementace

Základy programovacího jazyka HTML. Autor: Ing. Jan Nožička SOŠ a SOU Česká Lípa VY_32_INOVACE_1133_Základy programovacího jazyka HTML_PWP

HTML - Úvod. Zpracoval: Petr Lasák

HTML - stručná reference

Jazyk HTML SOŠ OTROKOVICE, TŘ. T. BATI 1266, OTROKOVICE Pomocný text pro výuku výpočetní techniky. PaedDr. Pavel Kovář

IE1 jazyk HTML a kaskádové styly

Web dizajnér - zadanie školského kola. Informácie o projekte. Informácie o podmienkach

Tvorba fotogalerie v HTML str.1

IE1 jazyk HTML a kaskádové styly

1 Úvod. 2 Tvorba internetových prezentací. 2.1 Nástroje pro tvorbu prezentace. Stránka 1

HTML - pokračování. Co už víme?

Mgr. Vlastislav Kučera Struktura stránky, hlavička,

CSS styly. Cascading Style Sheets kaskádové styly

Microsoft POWERPOINT XP

tvoříme web HTML/CSS

Bloky. Tag Význam Párový. p odstavec nepovinně. br řádkový zlom ne. div oddíl ano. center vycentrování ano. h1 nadpis 1.

7.CVIČENIE. Základy HTML

Stránka se dá otevřít dvěma způsoby

Tvorba webových stránek

1. Zásady pri tvorbe prezentácií. 2. Vytvorenie prezentácie Úvodná snímka Vloženie ďalších snímok. PowerPoint 2003

Výukový materiál KA č.4 Spolupráce se ZŠ

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

TNPW1 Cvičení aneta.bartuskova@uhk.cz

Základy CSS (3. přednáška)

NSWI096 - INTERNET. Úvod do HTML

HTML. ICT_01., 02. konzultace; 2. ročník 1/6

NA POUŽITIE ŠABLÓNY PRE PÍSANIE ZÁVEREČNEJ PRÁCE

Základy HTML. Obecná syntaxe HTML. Struktura HTML

Buňka tabulky; tento tag doporučuju psát opět jako párový. Nyní již máme dostatek informací k tomu, abychom dokázali sestrojit jednoduchou tabulku.

Tvorba internetových stránek. Jazyk HTML

ÚVOD DO PC. Čo je počítač? Von Neumannova schéma Zapojenie počítača Spustenie počítača Ergonómia a hygiena

DVDStyler. Získanie programu. Inštalovanie. Začíname tvoriť DVD

Pracovné listy tvorba www stránok jazyk HTML

PŘÍRUČKA. Správa obsahu webové prezentace. Formátování textu

(X)HTML-TAGY. VOŠ a SŠT Česká Třebová

Internet 1 vývoj, html, css

RÝCHLO BÚK HTML & CSS

HTML. HyperText Markup Language Josef Steinberger

(X)HTML, CSS a jquery

Mgr. Vlastislav Kučera přednáška č. 2

Mgr. Vlastislav Kučera lekce č. 2

TVORBY JEDNODUCHÝCH WEB STRÁNEK

Kapitola 1. Pokyny ke studiu. Struktura textu. rozhodl jste se studovat modul Práce s Internetem.

CSS Stylování stránek. Zpracoval: Petr Lasák

Základy HTML (2. přednáška)

Transkript:

HTML HTML- HyperTextMarkUpLanguage (nadtextový značkový jazyk) HTML dokument (súbor) - textový súbor - prípony (.html,.htm) - obsahuje značky tagy, ktoré v prehliadačoch zabezpečia správne zobrazenie obsahu dokumentu. Obsah HTML dokumentu: - bežný formátovaný text, - zoznamy (číslované, nečíslované) - odkazy (hyperlinky, linky) na iné web-stránky alebo iné miesta v tej istej stránke, - tabuľky - obrázky, - videá, - formuláre. Tagy TAGY - párové (otvárací a uzatvárací) Príklad : <B>Toto bude napísané tučným písmom.</b> - samostatné (nepárový) Príklad: Toto je napísané v prvom riadku <BR>a toto už v druhom riadku.

<HTML> - párový tag, ktorý ohraničuje celý dokument. <HEAD> párový tag ohraničujúci hlavičku HTML dokumentu. <TITLE> párový tag, ohraničujúci titulok stránky. Umiestnený je v hlavičke. <BODY> párový tag, ohraničuje telo HTML dokumentu <BODY [atribut= hodnota ] [atribut= hodnota ]> BACKGROUND= adresa obrázku - vloží na pozadie stránky obrázok, BGCOLOR= farba - farba pozadia stránky Farba - číselne (od #00000 do #FFFFF) - slovom (red, blue, green,.) TEXT= farba - farba textu LINK= farba - farba linku (štandardne modrá) VLINK= farba - farba navštíveného linku ALINK= farba farba aktívneho linku <BR> - nepárový tag, zalomenie riadku Základné formátovanie odseku <P> - nepárový tag, zalomenie odseku <P [atribut= hodnota ] > ALIGN= zarovnanie zarovanie odseku (right, center, left) <CENTER> - párový tag, centrovanie odseku

Formátovanie textu Druh písma Formátovanie TAG Tučné <B></B> Kurzíva <I></I> Podčiarknuté <U></U> Preškrtnuté <S></S> S pevnou šírkou <TT></TT> Veľké <BIG></BIG> Malé <SMALL></SMALL> Dolný index <SUB></SUB> Horný index <SUP></SUP> Blikajúci text <BLINK></BLINK > <FONT> - párový tag veľkosť, farba a typ písma <FONT [atribut= hodnota ] [atribut= hodnota ] > SIZE=veľkosť COLOR= farba FACE= font - veľkosť písma - farba písma - typ písma Nadpisy: <H1>Nadpis prvej úrovne</h1> <H2>Nadpis druhej úrovne</h2> <H3>Nadpis tretej úrovne</h3> <H4>Nadpis štvrtej úrovne</h4> <H5>Nadpis piatej úrovne</h5> <H6>Nadpis šiestej úrovne</h6>

<HR> -nepárový tag, oddeľovacia čiara <HR [atribut= hodnota ] [atribut= hodnota ] > SIZE= veľkosť - hrúbka čiary NOSHADE čiara bez tieňa ALIGN= zarovnanie WIDTH= veľkosť veľkosť čiary (v bodoch- číslo, v %) Tvorba zoznamov <UL> - zoznam s odrážkami, párový tag <UL TYPE= hodnota > <LI>prvá položka</li> <LI>druhá položka</li> <LI>tretia položka</li> </UL> TYPE atribút môže nadobúdať hodnoty : disc, circle, square <OL> - číslovaný zoznam, párový tag <OL [atribut= hodnota ] [atribut= hodnota ] > TYPE =hodnota (a, A, i, I,1) START= počiatočná hodnota CONTINUE pokračovanie číslovania, ALIGN= zarovnanie <DL> - Definičný zoznam, párový tag

<DT> - názov položky <DD> - definícia položky TABUĽKY <TABLE> - párový tag ohraničujúci tabuľku <TR> - parový tag - -definícia riadku <TD> - párový tag definícia bunky <TH> - párový tag definícia hlavičky <TABLE [atribut= hodnota ] [atribut= hodnota ] > <TR><TD>obsah bunky</td><td>obsah bunky</td></tr> <TR><TD>obsah bunky</td><td>obsah bunky</td></tr> </TABLE> Atribúty pre <TABLE> BORDER=hodnota - hrúbka čiary- rámčeka (0 bez bez čiary) WIDTH= hodnota - šírka tabuľky (v bodoch a lebo v %) BGCOLOR= farba - farba pozadia tabuľky CELLSPACING= hodnota - vzdialenosť medzi bunkami CELLPADDING=hodnota - vzdialenosť textu od čiary Atribúty pre <TR><TD><TH>: ALIGN= hodnota zarovnanie (vodorovné) VALIGN= hodnota zarovnanie (zvislé) ROWSPAN=hodnota zlúčenie viacerých buniek do jednej v jednom stĺpci COLSPAN=hodnota zlúčenie viacerých buniek do jednej v jednom riadku

VYTVORENIE LINKU (odkazu) Vytvorenie linku : na inú stránku, na inú pozíciu tej istej stránky, na obrázok, na súbor. <A> - párový tag, vytvorenie linku <A [atribut= adresa ]>text</a> Príklad: Atribút: HREF - určuje miesto na ktoré chcem odkázať NAME označenie miesta v tom istom dokumente Príklad: Príklad: <A HREF= http://www.sportgymke.sk ]>Školská stránka ŠG</A> <A NAME= #Upozornenie >Tu sa nachádza upozornenie</a>...... <A HREF= #Upozornenie ]>Po kliknuti prejdete na text upozornenia</a> <IMG> - nepárový tag, vloženie obrázku VLOŽENIE OBRÁZKU <IMG [atribut= hodnota ] [atribut= hodnota ] > SRC= adresa obrázku - zadanie adresy obrázku ALT= text - popis obrázku ALIGN= zarovnanie - zarovnanie (BOTTOM, TOP,, MIDDLE, LEFT, RIGHT) WIDTH=šírka HEIGHT=výška BORDER=hodnota šírka rámčeka okolo obrázku

Rámy Frames <frameset> - párový tag, rozdeľuje stánku na rámy, do ktorých sa načítavajú html- dokumenty, používa sa namiesto tagu <body> rozdelenie stránky do stĺpcových cols rámov rows rozdelenie stránky do riadkových rámov border šírka rámčeku medzi stránkami čiarkami oddelené dĺžky, percenta alebo * čiarkami oddelené dĺžky, percenta alebo * pixely <frame> - určuje priestor na načítanie html stánky nepárový tag, je to vnorený tag do tagu <frameset>. src zobrazovaná stránka URL name meno rámu pre určenie cieľa odkazov meno rámu noresize zrušenie možnosti zmeny veľkosti rámu bez hodnoty bordercolor farba rámčeku farba <frameset [atribut= hodnota ] [atribut= hodnota ] > <frame [atribut= hodnota ] [atribut= hodnota ]> <frame [atribut= hodnota ] [atribut= hodnota ]> </frameset>