1. 7. Grafika v HTML
TVORBA WEBU
VOŠ pro praxi
reg. č.: CZ.1.07/2.1.00/32.0044

2. 2.1.2013
FORMÁTY GRAFIKY
 „čitelnost“ pro prohlížeč
 výhradně rastrová grafika
 nejběžnější formáty:
 GIF - omezená barevná paleta
 PNG - volně šiřitelný
 JPEG - zachycení reálného světa
 kompromis mezi:
 kvalitou obrázku/fotky
 výslednou velikostí souboru
 optimum - objem do 100 kB na stránce
VOŠ pro praxi 2
reg. č.: CZ.1.07/2.1.00/32.0044

3. 2.1.2013
HTML - OBRÁZKY
 značka <img> s parametrem
src="cesta/jmeno_souboru.jpg"
 další parametry:
 alt = „alternativní text“
 title = „titulek obrázku“
 border = „tloušťka okraje„
 width = „max. šířka„
 height = „max. výška„
VOŠ pro praxi 3
reg. č.: CZ.1.07/2.1.00/32.0044

4. 2.1.2013
HTML – OBRÁZEK JAKO ODKAZ
 ukázka:
 <a href="images/fotka1.jpg">
 <img src="images/fotka1.jpg" width=100 title="Sněžení v
Praze">
 </a>
 odkaz na obrázek v plné velikosti:
 <a href="images/olomouc.jpg" target=_blank>
 <img src="images/olomouc.jpg" width="100">
 </a>
 lze řešit i pomocí dvou verzí fotografie:
 plná velikost
 miniatura
VOŠ pro praxi 4
reg. č.: CZ.1.07/2.1.00/32.0044

5. 2.1.2013
HTML – OBRÁZEK JAKO POZADÍ
 „vyskládání“ plochy grafickým souborem:
 dlaždice- čtverec či obdélník
 proužek - dlouhý nízký obrázek
 oba typy musí splňovat zásadu:
 hrany na sebe navazují - efekt jednolitého
pozadí
 definice pozadí
 CSS vlastnosti prvku body
VOŠ pro praxi 5
reg. č.: CZ.1.07/2.1.00/32.0044

6. 2.1.2013
HTML – TABULKY - 1
 využití tabulek:
 prezentace tabulkových dat
 pozicování objektů
 spojování obrázků s popisem
 rozvržení stránky
VOŠ pro praxi 6
reg. č.: CZ.1.07/2.1.00/32.0044

7. 2.1.2013
HTML – TABULKY - 2
 základní značky:
 <table> ohraničuje celou tabulku
 <tr> ohraničuje řádky
 <td> ohraničuje buňky
 <th> ohraničuje buňky záhlaví či zápatí
VOŠ pro praxi 7
reg. č.: CZ.1.07/2.1.00/32.0044