Stáhnout prezentaci
Prezentace se nahrává, počkejte prosím
1
Pravidla a doporučení pro názvy souborů
soubory pojmenovávejte pokud možno pouze malými písmeny v názvech souborů pokud možno nepoužívejte mezery (při názvu z více slov použijte např. podtržítko) v názvech souborů rozhodně nepoužívejte diakritiku přípona pro XHTML soubory: *.html přípona pro CSS soubory: *.css
2
XHTML – základní pravidla
značkovací jazyk používající tzv. tagy, které se píší malými písmeny a uzavírají se do znaků <> tagy se dělí na párové a nepárové příklad párového tagu: <p>odstavec</p> příklad nepárového tagu: <img src="obr.jpg" alt="obr" /> klávesová zkratka pro <>: ALT (pravý) + <> (klávesy přímo nad pravým ALT) ALT (levý) + 60 / 62 (numerická klávesnice)
3
XHTML – kostra dokumentu
<!-- DOCTYPE naznačuje podle jaké verze (X)HTML by měl být dokument validní. Má specifické postavení před samotným dokumentem, je nepárový, ale přesto se neukončuje lomítkem, objevují se v něm velká písmena --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" " <html xml:lang="cs" xmlns=" <!-- začátek dokumentu --> <head> <!– hlavička stránky --> <title>titulek stránky</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!-- kódování dokumentu --> <link rel="stylesheet" media="all" href="styl.css" type="text/css" /> <!– propojení s CSS souborem --> </head> <!– konec hlavičky --> <body> <!-- začátek těla stránky --> </body> <!– konec těla stránky --> </html> <!-- konec dokumentu -->
4
XHTML – tělo stránky (tagy div, p, span, a, h1…h6)
blokové prvky (div, p, h1, h2, h3, h4, h5, h6) řádkové prvky (a, span) div = blok p = odstavec h1, h2, h3, h4, h5, h6 = nadpisy od největšího k nejmenšímu a = hypertextový odkaz span = kontejner
5
XHTML – blokové a řádkové prvky v praxi
<div> <h1>nadpis</h1> <p>odstavec</p> <p>odstavec <span>číslo</span> 2</p> <p><a href=" </div> Hypertextové odkazy: absolutní x relativní x absolutní: <a href=" <!-- nezapomínejte na protokol --> relativní: <a href="zajmy.html">zájmy</a> <a
6
CSS - syntax selektor { vlastnost: hodnota; }
Selektory mohou být mj. tagy / prvky (body, div, p, h1, h2, h3, h4, h5, h6, span, a, ...). Pokud chceme např. nadefinovat pro celý dokument zarovnání textu doprostřed a barvu pozadí žlutou, zadáme: body { text-align: center; /* nezapomínejte na středník po zapsání každé vlastnosti */ background: yellow; Pozn.: Klávesové zkratky pro {} jsou ALT (pravý) + B / N nebo ALT (levý) / 125 (numerická klávesnice)
Podobné prezentace
