CSS pro vzhled

HTML říká, co na stránce je. O to, jak stránka vypadá, tedy o barvy, písma a velikosti a o to, kde co je, se stará druhý jazyk: CSS.

Stránka má teď druhý soubor, style.css. Mezi soubory se přepínáte nad editorem. Stránka soubor používá díky jedinému řádku ve své hlavičce:

<link rel="stylesheet" href="style.css">

Ten prohlížeči říká, že styly téhle stránky jsou v souboru style.css. Takovému souboru se říká soubor se styly (anglicky stylesheet) a ten náš říká tohle:

body {
    font-family: Arial, sans-serif;
    background-color: lightyellow;
}

h1 {
    color: purple;
    font-size: 32px;
}

Soubor se styly je seznam pravidel. Každé pravidlo začíná tím, co upravuje: body je celá stránka a h1 hlavní nadpis. Mezi složenými závorkami { a } jsou řádky ve tvaru vlastnost: hodnota;. Celá stránka má tedy písmo Arial na světle žlutém pozadí a nadpis je fialový a velký 32 pixelů. Pixel (px) je jeden drobný bod vaší obrazovky.

Barvy můžete psát jejich anglickými jmény: red (červená), orange (oranžová), teal (modrozelená), crimson (karmínová), gold (zlatá), hotpink (sytě růžová) a mnoho dalších. CSS je ale puntičkářské: když prohlížeč nějakému řádku nerozumí, třeba kvůli překlepu v barvě nebo chybějícímu px za číslem, prostě ho přeskočí.