Szövegek formázása

Címsorok, bekezdések, listák formázása

h1 {                                a legmagasabb szintű címsor a kijelölő, tehát ezek lesznek ilyenek
    font-family: Arial,sans-serif;  a betűtípus Arial legyen, ha nincs, akkor bármilyen talpatlan
    font-size: 180%;                a betűméret a böngésző alapértelmezett értékének 180%-a
    color: IndianRed;               a betűszín IndianRed (kb. barnásvörös)
    text-align: center;             igazítsuk a lap közepére
 }
p {                       az összes bekezdésre vonatkozzon
    font-size: 16px;      a betűméret 16 pixel (képpont) legyen
    line-height: 150%;    a sorok távolsága legyen az alapértelmezett érték 150%-a (másfélszerese)
    margin-left:20px;     baloldali margója balról 20 pixel
 }

ol li {                          minden sorszámozott lista minden elemére
    font-weight: bold;           vastagított lesz
    font-style: italic;          (és még) dőlt betűs
    text-decoration: overline;   föléhúzásos (underline-aláhúzás, line-through-áthúzás)
    background-color: Azure;     a háttérszín Azure (halványkék, azúr)
 }

li {                      az ol és az ul listák mindegyikének elemeire hat
    margin-right: 50%;    előbb beállítjuk a jobboldali margót a lap közepére
    text-align: right;    a listát jobbra igazítjuk (a lap középső vonalához "simulnak")
 }
p {
    text-align: justify;  a szövegek mind a bal, mind a jobb oldalra szépen rendeződnek (Word-ben sorkizárt)
 }

h4 {                                 a 4-es szintű címsorokra
    border-bottom: 2px solid Blue;   alatta 2px vastag, folytonos (lehetne double,dotted,dashed,stb.) kék vonal
 }
p span {                             bekezdésbeli span tag-eknél (pl. <p> nem keretes <span>keretes</span> ez sem </p>)
    border: 3px double Red;          3px vastag, dupla vonalas, vörös színű szegély lesz körben
 {
h5, h6 {                             az 5-ös és a 6-os szintű címsorok mindegyikére
    border-top: 1px dotted Green;    1px-es, szaggatott, zöld vonal van felettük
 }

Listák speciális formázása

ul {                            minden felsorolás listajeleire vonatkozik
    list-style-type: square;    tömör négyzetek (circle-üres kör, disc-tömör kör,alapértelmezett, none-nincs)
    color: DarkRed;             színe vörös (a listajelé is)
 }
ul ul {                         a lista második (belső) szintjére hat
    list-style-type: none;      nem lesz listajel
    line-height: 150%;          de a sorok távolsága 50%-kal nő
 }

ol {                                minden sorszámozott lista listajelei
    list-style-type: upper-latin;   latin nagybetűk (lower-roman-kisbetűs római szám, decimal-szám,alapértelmezett)
    margin-left: 20px;              20 pixellel jobbra toljuk (bal felére 20px margó)
 }
ol ol {                             a lista második (belső) szintjére hat
    list-style-type:lower-greek;    görög kisbetűk
    background-color: LightYellow;  háttérszíne halványsárga
 }