www.helpmark.cz
© Tomáš Herout
4. 1. 2015
1
Obsah prezentace
» Jak naplánovat strukturu
» Vytvoření a provázání
» Co je to HTML a CSS
» Co používat za nástroje
»
» Struktura a logika HTML
»
» DOCTYPE
»
» Hlavička (X)HTML
»
» Tělo (X)HTML
»
» Skupiny (X)HTML tagů
»
» Vztah mezi HTML a CSS
»
»
»
www.helpmark.cz
externího CSS souboru/ů
Pravidla a logika CSS
O selektorech
O hodnotách
O vlastnostech
Ovlivnění vzhledu obsahu
Tvorba layout
CSS a různé prohlížeče
Zásady validity HTML i CSS
Užiteční pomocníci
© Tomáš Herout
4. 1. 2015
2
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
3
Tři vrstvy webu
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
4
Postup plánování
Stanovení cílů webu (hlavní, vedlejší, postupové)
2. Vytvoření wireframe, neboli drátěný model
rozmístění prvků, ale bez grafického provedení
1.
(rozmístění menu, sloupců…, reakce na návštěvníka…)
3.
Skica – oproti wireframe obsahuje i grafické
prvky (pro HTML a CSS není zásadní)
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
5
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
6
Co je HTML a XHTML
» HyperText Markup Language
Text se značkami (tagy) označujícími význam.
Existuje od roku 1991 (verze 0.9), od 1999 verze
4.01. Dnes HTML5, ale stále ve vývoji.
» Extensible HyperText Markup Language
Totéž co HTML, ale přísnější pravidla
• XHTML 1.0 Strict – relativně hodně striktní
• XHTML 1.0 Transitional – dovoluje některé
zavržené prvky
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
7
Co je to CSS
» Cascading Style Sheets
určuje jak se budou zobrazovat prvky (X)HTML
» Může být vkládán přímo do HTML, ale není to
vhodné
» V případě XHTML být vkládán do kódu nemá,
avšak fungovat bude i vložený
» Existují verze 1. 2. a 3.
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
8
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
9
Nástroje pro HTML a CSS
» Aptana – zdarma editor HTML, CSS, PHP
i s dokončováním (našeptáváním) slov
» PSPad – zdarma editor HTML, CSS, PHP…
» Dreamweaver – placený špičkový editor
» KompoZer – zdarma editor HTML a CSS (Slunečnice)
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
10
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
11
Ukázka HTML kódu
<!DOCTYPE html>
<html lang="cs" dir="ltr">
<head>
<meta charset="utf-8"> …
</head>
<body>
<h1> Hlavní nadpis stránky </h1>
</body>
</html>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
12
Struktura (X)HTML
» (X)HTML je určen výhradně pro strukturování dat
» Skládá se z těchto hlavních částí
• DOCTYPE který deklaruje použitou verzi
• HTML jež začíná <html> a končí </html>
• Hlavičky jež začíná <head> a končí </head>
• Těla jež začíná <body> a končí </body>
» Data jsou označována tagy
např.: <h1> Toto je hlavní nadpis </h1>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
13
Tagy, jejich parametry a hodnoty
Uzavírací tag
Otevírací tag
<a href= "odkaz.html" target="_blank" >odkaz</a>
Parametr
Hodnota
Parametr
Hodnota
Ovlivněný text
Atribut
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
14
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
15
DOCTYPE není věda
<!doctype html >
Deklarace pro HTML5
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
Deklarace pro
XHTML 1.0
» Deklaruje použitou verzi HTML a tím říká, jak má
prohlížeč kód interpretovat
» Pokud nepoužijete DOCTYPE, budou se stránky
interpretovat v nestandardní režimu
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
16
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
17
Tagy pro hlavičku
» <title> vkládá titulek stránky, který se zobrazí ve
vyhledávačích a záhlaví okna prohlížeče </title>
» <meta> doplňuje informace o stránce
• <meta name="description" content="popis" />
• <meta http-equiv="Content-Type"
content="text/html;charset=utf-8" />
• <meta scheme=„YYYY-MM-DD“ name="date"
content="2012-10-01" /> (HTML 4.01)
 <link rel="stylesheet" href="/styl.css"
type="text/css" />
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
18
Důležité druhy META I.
» name="description" – popis stránky, v SEO
nejmocnější nástroj
 name="robots" – informace pro roboty
content= (index/noindex, follow/nofollow)
» name="keywords" – klíčová slova pro
vyhledávače, dnes zbytečné
» name="autor" – autor obsahu webu
» http-equiv="Content-language" – nastaví třeba
content="cs" (český obsah)
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
19
Důležité druhy META II.
 http-equiv="Content-Type"
content="text/html;charset=utf-8" – určuje znakovou
sadu
 Můžete také přesměrovávat stránku, ukázka:
<meta http-equiv="refresh"
content="6;URL=http://helpmark.cz">
Počet sekund před
přesměrováním
www.helpmark.cz
Adresa
přesměrování
© Tomáš Herout
4. 1. 2015
20
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
21
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitionat//EN„
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<title>školení, konzultace, tvorba webu a obsahu - HelpMark</title>
<meta name="description" content="Nabízíme: školení, konzultace, návody pro Joomla/>
<meta name="keywords" content="SEO, marketing, školení, webdesign, copywriting" />
<meta name="author" content="Tomas Herout" />
</head>
<body>
<h1> Toto je hlavní nadpis těla XHTML dolumentu </h1>
<p> Odstavec textu dokumentu před zalomením <br />
pokračování za zalomením </p>
</body>
</html>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
22
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
23
Seznam důležitých tagů
» Texty – <h1> <p> <strong>
<em> <cite> <code> <abbr>
<address> <ul> <ol> <li>
» Formuláře – <form>
<imput> <select> <option>
<textarea>
» Odkazy – <a>
» Skripty – <script>
» Obrázky – <img>
» Události – myši; klávesnice
» Tabulky – <table> <tr> <th>
» Styly – <style>
<td><caption>
» Objekty – <object>
<param>
www.helpmark.cz
» Rámce – <iframe>
» Oddíly – <div> <span> <hr>
© Tomáš Herout
4. 1. 2015
24
Texty a jejich tagy I.
» <h1> – označuje nadpis číselné úrovně od <h1> až po <h6>,
jedná se o párový tag, musí být tedy uzavřen
» <p> – označuje odstavec textu, text se bude sám zarovnávat
podle velikosti bloku nebo okna prohlížeče, je párový
» <br /> – provádí „ruční“ zalomení textu v odstavci, nepárový
» <strong> – zvýrazní tu část textu ve které se nachází,
zobrazí jako tučné, pro vyhledávače znamená důležité, párový
» <em> – mění text na kurzívu, párový
» <cite> – označuje citaci v textu, párový
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
25
Texty a jejich tagy II.
» <code> – označuje část textu jako kód, měl by
se zobrazit fontem „Courier“, párový
» <abbr> – označuje zkratku, nemá vliv na vzhled,
pokud to není nastaveno v CSS, párový
» <address> – obsah označuje za adresu pro
vyhledávače je to velmi užitečné, změní vzhled
na kurzívu, ale to lze v CSS změnit, párový
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
26
Texty a jejich tagy III.
» <ul> – označuje začátek neuspořádaného
seznamu, párový
» <ol> – označuje začátek uspořádaného seznamu
(1,2… a, b.…), párový, atributy:
type= "1" "A" "a " "I"
» <li> – označuje položky seznamu, párový
<ol type="a">
<li> Položka seznamu </li>
</ol>
www.helpmark.cz
a. Položka seznamu
© Tomáš Herout
4. 1. 2015
27
Odkazy relativní, absolutní
» Odkaz se označuje tagem <a>
» Má další atributy:
• href=" " – mezi uvozovky se uvádí URL adresa buď
relativní v případě vnitřního odkazu, nebo absolutní
• title=" " – vytvoří bublinkovou nápovědu k odkazu
• target=" " – označuje chování např.
"_blanc" – nové okno | "_parent" – v nadřazeném rámci
<a href="/odkaz.html" target="_blank" >odkaz</a>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
28
Odkazy na kotvy
» Kotva je odkaz uvnitř dané stránky
<a href="/#kotva">odkaz</a>
 Vytvoření kotvy – <a name=""></a>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitionat//EN„
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
…
</head>
<body>
<a name="kotva"></a><h1> Toto je hlavní nadpis těla XHTML dolumentu </h1>
<p> Odstavec textu dokumentu před zalomením <br />
pokračování za zalomením </p>
</body>
</html>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
29
Obrázky
» Tag <img> nepárový. Jeho atributy:
• src=" " – URL adresa směřující na umístění obrázku
• alt=" " – alternativní popis, důležité pro SEO a čtečky webů
určené pro slepé
• title=" " – titulek se zobrazí v „bublině“ nad obrázkem
• width=" " – určuje šířku zobrazení obrázku v pixelech
• height=" " – určuje výšku zobrazení obrázku v pixelech
<img src="/obrazek.png" alt="popis" title="titulek"
width="200" height="200" />
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
30
Tabulky I.
» Nacházejí se mezi tagy <table> a </table>
» Řádek se ohraničí <tr> a </tr>
» Obsah buňky hlavičky ohraničuje <th> a </th>
» Obsah buňky těla ohraničuje <td> a </td>
» Parametr clospan slučuje buňky v řádku
» Parametr rowspan slučuje buňky v sloupci
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
31
Tabulky II.
<table>
<tr>
<th> hlavička 1. sloupce </th> <th> hlavička 2. sloupce </th>
</tr>
<tr>
<td> tělo 1. sloupce </td>
<td> tělo 2. sloupce </td>
</tr>
<tr>
<td clospan= "2"> buňka přes oba dva sloupce</td>
</tr>
</table>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
32
Objekty
» Pomocí tagů <object> a </object> umístíte
libovolný objekt do HTML
» Atributy:
• data="/flash.swf" (URL adresa objektu)
• width="300" (šířka vyhrazená pro objekt)
• height="400" (výška vyhrazená pro objekt)
• type="application/x-shockwave-flash"(specifikuje
druh objektu např. flash)
» Parametry <param name="neco" value="neco">
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
33
Formuláře I.
» Formuláře se skládají ze dvou částí
• Formulář v HTML umístěný na webu
• PHP skript provádějící např. odeslání mailu nebo
uložení do databáze
» Formuláře se umisťují mezi značky
<form> a </form>
» Do otevírací značky se uvádějí atributy:
<form metod="post" action="/odeslani-formulare.php">
… </form>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
34
Formuláře II.
Tag <input> – pole pro text, tlačítka, volby…
» Atributy:
• name="nazev_pole" – název, který přiřadí
k odeslaným datům
• type="text" – druh pole
•
•
•
•
•
•
text – běžné textové pole
password – pole s maskovaným vstupem
checkbox – zaškrtávací pole
radio – přepínání mezi možnostmi (nelze dvě)
submit – potvrzovací tlačítko
reset – tlačítko na vymazání obsahu…
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
35
Formuláře III.
• type="text" (pokračování)
• image – grafické tlačítko na odeslání s možností
odeslat souřadnice
• button – tlačítko ovládané pomocí skriptů
• file – otevře dialog pro výběr souboru určeného
k odeslání
• hidden – používá se pro přenesení nezobrazených
informací
• maxlength – definuje číslem max. počet znaků
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
36
Formuláře VI.
Tag <textarea> – víceřádkové pole pro text
» Atributy:
• Name="" (název, který přiřadí k odeslaným datům)
• Rows="" (výška pole)
• Cols="" (šířka pole)
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
37
Formuláře V.
Tag <select> – pole pro výběr z možností
» Atributy:
• Name= "" (název, který přiřadí k odeslaným datům)
• size= "1" (číselná hodnota udávající velikost pole,
pokud je hodnota "1" vytvoří se roletka)
• multiple="" (umožní zvolit více možností)
<select name="polozky" multiple size="2">
<option> první </option>
…
</select>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
38
Skripty v HTML
Nejčastěji se používá JavaScript, který se uzavírá
mezi tagy <script> a </script>
» Atribury
• type="" (identifikace jazyka)
• src= "/script.js" (URL adresa externího skriptu)
<script type="text/javascript">
…
</script>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
39
Události
<a href="/něco.html">
<img src="/obr.png" onmouseover="this.src=
'/obr_a.jpg'; "onmouseout="this.src='/obr.jpg'; "> </a>
» onmouseover – při najetí myší na prvek
» onmouseout – při opuštění prvku myší
» onclick – při kliknutí
» ondbclick – při dvojitém kliknutí
» onsubmit – před odesláním formuláře
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
40
Události
<a href=„/něco.html“>
<img src="/obr.png" onmouseover="this.src=
'/obr_a.jpg'; "onmouseout="this.src='/obr.jpg'; "> </a>
» onmouseover – při najetí myší na prvek
» onmouseout – při opuštění prvku myší
» onclick – při kliknutí
» ondbclick – při dvojitém kliknutí
» onsubmit – před odesláním formuláře
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
41
Styly
» Umožní vložit styl přímo do HTML – nevhodné !!!
» Používá se atribut style=""
<p style="color: #ff9900; background-color: #ffff00">
…
</p>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
42
Rámce
Do HTML umožní umístit obsah z jiného umístění
» Atributy
• src="http://…" (URL adresa zdroje)
• width="300" (šířka vyhrazená pro objekt)
• height="400" (výška vyhrazená pro objekt)
<iframe src="http://... " width="200" height="100">
Alternativní text pro případ nezobrazení obsahu iframe
</iframe>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
43
Oddíly
» <div> – označení bloku
» <span> – označení části uvnitř bloku
» <hr> – oddělení stránky
Pouze v HTML5
» <nav> – blok určený pro navigační odkazy
» <section> – označení bloku kapitoly stránky
» <header> – záhlaví stránky, nadpis, pretext…
» <footer> – doprovodné informace k článku
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
44
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
45
Styly vzhledu v HTML
Styly zapsané přímo v HTML pro každý tag
samostatně
2. Označení HTML tagů a vytvoření stylů v záhlaví
HTML dokumentu
3. Samostatný externí CSS soubor (doporučeno)
1.
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
46
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
47
Jak na externí CSS soubor
Vytvořte soubor s příponou *.css
2. Do hlavičky HTML vložte odkaz na tento soubor
1.
<html>
<head>
<link href="/styly.css" rel="stylesheet" type="text/css">
… </head>
<body> … </body>
</html>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
48
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
49
Popis struktury CSS
Selektor
Vlastnost
h1 {
color: #FF0000;
font-size: 24px;
}
Hodnota
Deklarace vlastnosti
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
50
Základní pravidla CSS I.
» Styly se dědí podle kaskádovosti
» Různé zápisy mají různou sílu dle specifičnosti
1. řádkový styl
2. identifikátor
3. třída
4. univerzální selektor
»
<p style="color: red"> </p>
<div id="neco"> CSS #neco { }
<div class="neco"> CSS .neco { }
<p> </p> CSS p { }
Čím specifičtější, tím vyšší síla
slabší #neco; silnější div#neco;
ještě silnější div#neco .neco2
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
51
Základní pravidla CSS II.
» Některé styly se dědí od rodičů ve struktuře
HTML. Rodič předává své vlastnosti dítěti
» Mezery v zápisu jsou ignorovány
» Každá deklarace musí být oddělena středníkem
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
52
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
53
Druhy selektorů
Obecný selektor platí na druhy tagů
(např.:*, h1, p, img, a…)
zápis: h1 {color: red;…}
2. Selektor třídy lze používat opakovaně
(např.: <div class="cervena">)
zápis: .cervena {color: red;…}
3. Selektor id lze použít jen jednou (větší síla)
(např.: <div id="cervena">)
zápis: #cervena {color: red;…}
1.
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
54
Způsoby zápisu I.
» Jednoduchý:
h1 {color: red;…}
element {vlastnost:hodnota;…}
» Vícenásobný:
element1, element2, … {vlastnost:hodnota;…}
h1, h2, h3 {color: red;…}
» Rodičovský bez sledování hloubky:
element_rodic element_potomka {deklarace}
div.obsah h1 {color: red;…}
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
55
Způsoby zápisu II.
» Rodičovský pouze v přímém vztahu:
element_rodice > element_potomka {deklarace}
div.obsah > h1 {color: red;…}
 Sourozenecký sousedící:
element_soused + element_soused {deklarace}
h1 + p {color: black;…}
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
56
Způsoby zápisu III.
» Selektor podmíněný parametry:
element [parametr] {vlastnost:hodnota;…}
a [title="titulek"] {color: red;…}
 Selektor pseudotřídy:
element:pseudotřída {deklarace}
a:hover {color: red;…}
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
57
Některé pseudotřídy
» hover – aktivuje se v případě umístění kurzoru
» link – působí pouze na nenavštívené odkazy
» visited – působí pouze na navštívené odkazy
» active – reaguje na kliknutí a držení tl. myši
» first-line – aplikuje se pouze na první řádek
» lang – ovlivňuje pouze určený jazyk (en)
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
58
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
59
O některých hodnotách
Rozměry
Barvy
» px – pixely (body)
» hexadecimální
» em – šířka velkého M
#FF0000
» RGB 0 až 255
rgb(255, 0, 0)
» RGB v poměru
rgb(100%, 0%, 0%)
» textem
red, white, black…
» ex – šířka malého x
» mm – milimetry
» cm – centimetry
» % – poměrná hodnota
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
60
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
61
Skupiny vlastností
» Text – color, font, text, letter-spacing, line-height
» Rozměry – width, height
» Box – border, padding, margin, overflow, display
» Umístění – position, top, right, bottom, left, float,
clear, z-index
» Pozadí a barvy – background, opacity
» Seznamy – list-style, counter
» Ostatní – cursor
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
62
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
63
Ukázka ovlivnění obsahu
h1, h2, p {
font-family: Arial, Helvetica, sans-serif;
font-size: 11pt;
color: #333333; }
#nazev h1 {
line-height: 1.5;
margin: 5px 0; }
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
64
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
65
<div id= "telo" style="width: 900px ; height: auto; margin: 0 auto">
<div id="hlavicka" style="width: 800px ; height: 50px;
margin: 100px 49px 3px 49px">
</div>
<div id= "l_sloupec"
style="width:
200px; height: auto;
margin: 3px auto
3px 49px;
float: left">
</div>
<div id= "p_sloupec" style="width: 400px;
height: auto; margin: 3px 49px 3px auto;
float: right"> </div>
<div class= "neobtekat" style= "clear: both"> </div>
<p> Nějaký obsah článku </p>
</div>
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
66
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
67
Prohlížeče
Nejčastěji používané prohlížeče
» Chrome – možnost ve verzi portable
» Internet Explorer – problém s testováním
a instalací více verzí na jednom PC
» Mozilla Firefox – možnost ve verzi portable
» Opera – možnost ve verzi portable
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
68
Metody úprav pro prohlížeče
Speciální CSS soubory pro daný prohlížeč
1.
<head> …
<!--[if lte IE 6]>
<link href="/ieonly.css" rel="stylesheet" type="text/css" />
<![endif]-->
</head>
Hacky pro IE
2.
•
•
!important – tomuto nerozumí IE6 a nižší
*html – tomuto rozumí jen IE6 a nižší
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
69
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
70
Validátory
Validace HTML
http://validator.w3.org/
Validace CSS
http://jigsaw.w3.org/css-validator/
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
71
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
72
SW aplikace a rozšíření
» PSPad – zdarma editor HTML, CSS, PHP…
» Dreamweaver – placený špičkový editor
» KompoZer – zdarma editor HTML a CSS
(Slunečnice)
» Web developer – sledování prvků webu (FF i CH)
» Firebug – rozšíření pro Firefox na zkoumání kódu
» IE tester – aplikace na testování verzí IE
» Wamp server – samoinstalace Apach a MySQL
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
73
Doporučená literatura
» HTML, XHTML a CSS – Computer Press
» Kapesní přehled CSS – Computer Press
» CSS finty, hacky a pokročilé postupy –
Zoner Press
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
74
www.helpmark.cz
© Tomáš Herout
4. 1. 2015
75
Download

doctype html