Krátký úvodní kurz HTML Jenyk Obecně 1 - html  V HTML jazyce nezáleží na rozložení a délce řádku, extrémem je napsat celý program v jednom řádku.

Slides:



Advertisements
Podobné prezentace
Základy HTML – vkládání objektů
Advertisements

Úvod do tvorby internetových stránek v jazyce HTML Dostupné z Metodického portálu ISSN: , financovaného z ESF a státního rozpočtu.
Jazyk HTML. Zdrojový kód  Elementy obsah obsah př. důležité př. důležité př. př.
Štěpán Šípal Gymnázium Čakovice. Dnešní témata  Vznik XHTML a předchůdci  Základní prvky XHTML dokumentu  Tagy a atributy  Elementy a jejich druhy.
WWW stránky.
ZÁKLADY HTML Číslo DUM: VY_32_INOVACE_04_11 Autor: Mgr. Ivana Matyášková Datum vytvoření: duben 2013 Ročník: tercie Vzdělávací obor: informační technologie.
Technologie pro publikování na webu 1 Ing. Jiří Štěpánek.
TNPW1 Technologie pro publikování na webu Přednáška č. 4 seznamy seznamy tabulky tabulky jejich sémantika jejich sémantika Ing. Martin Adámek Katedra informačních.
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
Title of the document The content of the document Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás Autorem materiálu a všech jeho částí, není-li.
<. DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4
Základy HTML.
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
Tvorba www stránek VLOŽENÍ OBRÁZKŮ ICT 4.ročník. Vložení obrázku OBRÁZEK NA WEBOVÝCH STRÁNKÁCH Binární data – ukládáme do samostatných složek (IMAGE,
Tvorba stránek  komu jsou stránky určeny  grafická úprava stránek  obsah  motivy vzhledu stránky
HyperText Markup Language
VY_32_INOVACE_4.3.IV1.02/Ku Html dokument a jeho struktura Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Pavla Kubínková CZ.1.07/1.5.00/
Programování HTML stránek
Úvod do html kódu. Roman Hendrich
Tvorba www stránek SYNTAXE ICT 4.ročník. Obsah TAGY TAGY ATRIBUTY ATRIBUTY KŘÍŽENÍ TAGŮ KŘÍŽENÍ TAGŮ VELIKOST PÍSMEN VELIKOST PÍSMEN MEZERY VE ZDROJOVÉM.
TAGY A STRUKTURA WEBOVÉ STRÁNKY. web – skupina webových stránek a dalších souborů (styly, obrázky, …), které na sebe navzájem odkazují jazyky pro psaní.
TVORBA WEBOVÝCH STRÁNEK
Tematická oblast: Aplikační software pro práci s informacemi II.
Tvorba www stránek ODKAZY ICT 4.ročník. Vložení odkazu ODKAZY K propojení jednotlivých souborů K propojení jednotlivých souborů K přechodu na jiný web.
Formátování textu. Odstavce  tvoříme párovou značkou  text bude od ostatního textu oddělen Konec řádky  nepárová značka způsobuje ukončení řádku a.
Jazyk HTML.
VY_32_INOVACE_4.3.IVT1.11/Oc Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Ing. Jaroslav Ochodek CZ.1.07/1.5.00/ Tvorba webových.
Veronika Hladíková. V dnešní době se dají webové stránky zhotovit mnoha způsoby, ale zdaleka ne všechny jsou ty správné. V následující prezentaci se Vám.
Třídy, generické třídy, pseudotřídy
HTML (XHTML) 2. 2 HYPERTEXTOVÉ ODKAZY Odkaz může ukazovat na různá místa v internetu, na další Vaše internetové stránky nebo obrázky či jiné dokumenty.
Kaskádové styly Cascading Style Sheets. Využití CSS jde o jazyk pro popis způsobu zobrazení stránek napsaných v jazycích HTML, XHTML nebo XML umožňuje.
XHTML – tabulky Mgr. Lenka Švancarová Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Lenka Švancarová. Dostupné z Metodického portálu.
Kaskádové styly - CSS.
Pravidla a doporučení pro názvy souborů
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
HTML, XHTML a CSS Základy jazyků značek.
CSS – style Mgr. Lenka Švancarová. CSS – značka style (textstyle.html)
TNPW1 Cvičení
Číslo projektuCZ.1.07/1.5.00/ Číslo materiáluVY_32_INOVACE_259 Název školyGymnázium, Tachov, Pionýrská 1370 Autor Ing. Roman Bartoš Předmět Informatika.
CSS styly Kaskádové styly (CSS – Cascading Style Sheets) jsou prostředkem, který zajišťuje jednotný vzhled publikovaných stránek. Technologii CSS podporují.
CSS Cascading Style Sheets Kaskádové styly
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
XHTML – obrázky Mgr. Lenka Švancarová Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Lenka Švancarová. Dostupné z Metodického portálu.
Obchodní akademie a Střední odborná škola, gen. F. Fajtla, Louny, p.o. Osvoboditelů 380, Louny Číslo projektuCZ.1.07/1.5.00/ Číslo sady29Číslo DUM16.
Tvorba webu Jazyk HTML, úvod
Tvorba www stránek Seznam, tabulky, grafika a barvy (1.část) Ing. Miroslav Vachůn, Ph.D.
XHTML – formátování textu, vodorovná čára Mgr. Lenka Švancarová.
Obrázky v HTML dokumentech Druhy a použití. Obrázky + Zvyšují atraktivitu stránek. + Zvyšují vypovídací schopnost stránek. - Zvyšují dobu načítání stránky.
VY_32_INOVACE_4.3.IVT1.05/Ku Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Pavla Kubínková CZ.1.07/1.5.00/ CSS.
HTML JAZYK Výuka HTML jazyka pro střední školy. 1. Jazyk HTML Standardní značkovací jazyk používaný pro dokumenty na webu. Jazyk HTML pomocí tágů (značek)
Základní pojmy (1) Nejpoužívanější internetové prohlížeče: Google Chrome (32.0.x), Mozilla Firefox (27.0), Internet Explorer (11.0.2), Opera (19.0.x),
Číslo šablony: III/2 VY_32_INOVACE_P4_3.11 Tematická oblast: Aplikační software pro práci s informacemi II. HTML - odkazy, obrázky Typ: DUM - kombinovaný.
Párová a nepárová značka, atributy a jejich hodnoty
VY_32_INOVACE_4.3.IVT1.13/Oc Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Ing. Jaroslav Ochodek CZ.1.07/1.5.00/ Tvorba webových.
HTML – TABULKY. - uzavírá celou strukturu tabulky atributy tabulky:  align - obtékání tabulky ostatním textem – right, left, center  cellpadding – vnitřní.
Kaskádové styly Cascading Style Sheets. Využití CSS jde o jazyk pro popis způsobu zobrazení stránek napsaných v jazycích HTML, XHTML nebo XML umožňuje.
VY_32_INOVACE_4.3.IVT1.07/Ku Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Pavla Kubínková CZ.1.07/1.5.00/ CSS formátování.
PHP Programy pro tvorbu WWW stránek - 01
HTML - vložení obrázku značka pro vložení obrázku : <img>
Tvorba www stránok.
HTML pokračování. Co obsahuje každý html dokument? stránka stránka ahoj světe HTML.
Elektronické učební materiály - II. stupeň Informatika – aplikace informačních technologií Autor: Bc. Pavel Šiktanc Internetové stránky II. Co se všechno.
1 Kurz XHTML a CSS Část 1: Náš první XTHML dokument a jeho publikace na internetu.
Základy tvorby www stránky v HTML kódu. © Mgr. Petr Loskot, leden Časopis PPK Časopis PC World.
NÁZEV ŠKOLY: Masarykova základní škola a mateřská škola Melč, okres Opava, příspěvková organizace ČÍSLO PROJEKTU: CZ.1.07/1.4.00/ AUTOR: Mgr. Vladimír.
Co je to webová prezentace?
Tvorba WEBOVÝCH stránek – obrázky
NÁZEV ŠKOLY: Základní škola Josefa Bublíka, Bánov
NÁZEV ŠKOLY: Základní škola Josefa Bublíka, Bánov
Jazyk HTML (1) Jazyk HTML (Hypertext Markup Language) se používá pro vytváření Web Pages (www stránek) HTML používá text a sadu formátovacích značek, označovaných.
Transkript prezentace:

Krátký úvodní kurz HTML Jenyk 2012

Obecně 1 - html  V HTML jazyce nezáleží na rozložení a délce řádku, extrémem je napsat celý program v jednom řádku  Až na některé vybrané příkazy jsou všechny příkazy párové např. ble ble ble ble  Nezáleží na pořadí parametrů příkazu Jenyk, 2012

Obecně 2 - html  Programovací jazyk HTML je primitivní, nejdou v něm vytvářet složitější stránky, upravovat rozložení a dynamiku stránek.  Při zadávání výrazů a jejich ukončování je dobré dodržovat stejné pořadí. Např. ahoj.  Původní verze HTML nerozlišuje mezi velkými a malými písmeny, příkaz, i je funkčně naprosto stejný. Jenyk, 2012

Obecně 3 – html5 a xhtml  Nová verze jazyka html5 ale striktně používá při vytváření pouze malých písmen. Tedy.  Nyní se také používá při vytváření WWW stránek i jazyk xhtml, který je daleko přísnější ve svých požadavcích na syntaxi.  Navíc protože ale předpokládáme možnou provázanost s jazykem JavaScript, VBScript nebo PHP, které velikost písmen rozlišují a někdy vyžadují pro své příkazy malá písmena, je vhodné použít vždy raději malá písmena.  U nepárových příkazů např. se v syntaxi zápisu jazyka html5 používá upravený zápis, který zároveň označuje začátek i konec nepárového příkazu Jenyk, 2012

Ukázka zápisu hlavičky souboru html  (příkaz určující začátek HTML stránky)  (začátek hlavičky, která obsahuje definice stránky)  (nastavení českého prostředí, znaková sada)  (název stránky, vyhledávač ho dovede zpracovat)  (název stránky, vyhledávač ho dovede zpracovat)   Jenyk, 2012

Formátování  <body background=“vobrazy.jpg” nebo bgcolor=“red” text=„barva textu“ link=„barva odkazu“ vlink=„barva navštíveného odkazu alink=„barva vybraných odkazů“>  další řádek  nebo odstavec  středění  blok textu Jenyk, 2012

Písmo  tučně  size = velikost 1 -7  kurziva  podtrženě  přeškrtnout  nadpis Jenyk, 2012

Hypertextové odkazy   otevře jiné www okno otevře jiné www okno _self = ve stejném, _top = maximalizované, _blank = úplně nové, _parent = v nadřazeném   odkaz do pošty odkaz do pošty Jenyk, 2012

Vložení obrázku   border = rámeček width = šířka height = výška src = umístění title = popis Jenyk, 2012

Tabulky 1   border = rámeček cellSpacing = mezera mezi buňkami cellPadding = mezera uvnitř buňky bordercolor = barva rámečku Width = šířka tabulky v % nebo v pixelech Jenyk, 2012

Tabulky 2   Řádek tabulky :   height = výška   align = left, center, right   bordercolor =   bgcolor =   background =   valign = top, middle, bottom   nowrap Jenyk, 2012

Tabulky 3     buňka na řádku   width = šíře v % nebo pixelech   platí i ostatní parametry jako u tr Jenyk, 2012

Seznam  začátek seznamu  položka seznamu Jenyk, 2012

Vložení obrázku   src = adresa umístění alt = popis obrázku (žlutá nálepka) width = šíře výška = výška Není párový příkaz ! Jenyk, 2012

Vložení videa  img dynsrc="image\287_hugonis.jpg"  start="mouseover" nebo „fileopen“  loop="2" kolikrát  controls také tlačítko Ostatní parametry jako u obrázku. Nepárové. Jenyk, 2012

Vložení zvuku  bgsound src="image\paper020.wav"  loop="infinite„ = počet opakování loop = číslo nebo stále Jenyk, 2012

Další mediální prvky   - vložení vodorovné čáry - size = tloušťka, width = šíře - nepárová značka Jenyk, 2012

Další mediální prvky ahoj růžo - způsob vložení pohybujícího se textu Jenyk, 2012

Kaskádové styly 1  Umožňují předdefinovat vlastnosti písma, stránek a pod. <! - - h2 {font-family: verdana; font-size: 16pt; color: blue;} p {font-family: arial; font-size: 10pt; color: black;} -- > Jenyk, 2012

Kaskádové styly 2  Pokud definici stylu uložíte v sekci, platí vlastnosti pro celý dokument.  Pokud vytvářím nový styl, název začíná tečkou, např..cerveny {font-size: 12pt color=red}</style> Jenyk, 2012

Další zdroje informací  Programování stránek – Jak psát web  Obsahuje syntaxi HTML, HTML5, XHTML, HTML4, CSS  HTML pro začátečníky – zacatecniky.wz.cz/page.php?page_no=0 zacatecniky.wz.cz/page.php?page_no=0http:// zacatecniky.wz.cz/page.php?page_no=0  Kurz HTML, triky Jenyk, 2012