Stáhnout prezentaci
Prezentace se nahrává, počkejte prosím
1
Základy tvorby www stránky v HTML kódu. © Mgr. Petr Loskot, leden 2010 http://www.jakpsatweb.cz http://polopate.jakpsatweb.cz Časopis PPK Časopis PC World Wikipedia.cz Fotografie autora. Vložení obrázku
2
Obrázek Tag V HTML se obrázky vkládají nepárovým tagem. Má jeden povinný parametr src, který popisuje umístění obrázku. Dále může obsahovat mnoho nepovinných parametrů.
3
Obrázek Příklad vložení obrázku Soubor musí být (v tomto případě) ve stejné složce, jako je stránka (html soubor). Po vložení obrázku do stránky již nesmíme změnit umístění obrázku. (V praxi bývají ovšem obrázky uloženy v jiné složce)
4
Obrázek Příklad vložení obrázku z jiné složky Cesta popisuje umístění souboru ve struktuře složek – v rámci složky (např.:www), v níž máme stránky umístěny. Říkáme tomu relativní adresa. Po vložení obrázku do stránky již nesmíme změnit umístění ani název obrázku. Obrázky je vhodné předem uložit do jedné složky, např.: pictures.
5
Obrázek Příklad vložení obrázku z jiné stránky Dá se použít i absolutní adresa, třeba odkaz na web
8
Obrázek – změna velikosti obrázku atributy width a height Vložení obrázku s přesnými rozměry Vkládáme do stránky obrázek
11
Obrázek – rámeček obrázku Rámeček obrázku Vkládáme do stránky obrázek s rámečkem
14
Obrázek – popis obrázku Popis = název obrázku. Význam: Načítá-li se obrázek pomalu, objeví se na místě obrázku nejprve tento název. Stejná situace nastane, pokud se obrázek z nějakého důvodu nenačte. Název obrázku se objeví v dialogu při ukládání obrázku na HDD.
15
Obrázek-popis obrázku alt=… Vložení obrázku s popiskem Vkládáme do stránky obrázek
16
Obrázek – obtékání textu aling Align - zarovnání obrázku s okolím. Tag, atribut align=obtékání obrázku Left - obrázek je umístěn k levému okraji a obtékán zprava. Right - obrázek je umístěn k pravému okraji a obtékán zleva.
17
Obrázek – obtékání textu aling Vložení obrázku a zarovnání na pravo Obtékání obrázku umístěného vpravo Tato rozhledna bývala v minulosti hlavní pozorovatelnou Československé lidové armády na hranicích s imperialistickým Západním Německem. Dnes je to oblíbené turistické místo v národním parku Šumava. Nachází se na jednom z nejvyšších vrcholů Šumavy, hoře Poledník...
18
Obrázek – obtékání textu aling
20
Pozadí webové stránky Pod pojmem pozadí se na webových stránkách rozumí obvykle: barva pozadí, obrázek na pozadí, nebo většinou oboje najednou. Pozadí se řekne anglicky background.
21
Barva pozadí stránky Nastavení pozadí stránky se provede tagem. (pozn.: příkaz body se užívá, protože se jedná o nastavení těla celé stránky).
22
Barva pozadí stránky a barva textu Nastavíme-li tmavé pozadí stránky, je vhodné změnit barvu písma tak, aby byl text dobře čitelný. Např.:
23
Barva pozadí stránky a barva textu
25
Obrázek jako pozadí stránky Je třeba mít obrázek uložený v souboru typu: *.jpg, *.png, *.gif. Obrázkové pozadí by mělo splňovat některé požadavky: malý soubor (datově i rozměrově), bez ostrých kontur, na kterých by zanikalo písmo. Hodně práce si ušetříte, pokud soubor uložíte někde poblíž souborů stránek, ideálně ve stejném adresáři.
26
Obrázek jako pozadí stránky Pro vložení obrázku na pozadí stránky použijeme tag <body background= "cesta/pozadi.gif" Stránka s tímto zápisem bude mít na pozadí vykreslený obrázek pozadi.gif. Kdyby se z nějakého důvodu obrázek nezobrazil (nebo kdyby byl místy průhledný), je vhodné deklarovat pod obrázek ještě barvu pozadí. Barvu volíme tak, aby byla podobná odstínům obrázku. Tento kombinovaný tag by vypadal následovně:
27
Děkuji za pozornost © Mgr. Petr Loskot, 2010
28
Konec © Mgr. Petr Loskot, 2010
Podobné prezentace
