Načrtovanje in razvoj spletnih aplikacij

06: Oblika besedila

Spoznali bomo
  • Oblikovanje besedila s CSS

Izdelaj spletno stran, ki jo prikazuje spodnja slika in jo poimenuj 6vaja-css-priimek-ime.html. Stran naj bo izdelana v HTML5 in s CSS. Pazi na pravilno uporabo oznak in obliko zapisa kode.

Za predlogo uporabi 4.vajo iz poglavja HTML: 04: Fizično oblikovanje besedila.

CSS kodo vstavi v glavo spletne strani v oznako style.

Oblikovne lastnosti
  • ozadje:
- slika ozadja: slika ozadje.png
  • besedilo:
- pisava: Segoe, "Trebuchet MS", sans-serif
- barva: #444
- velikost: 0,9 kratnik velikosti pisve
- zgornji in spodnji notranji odmik: 10 pik
  • glavni naslov:
- pisava: "Lucida Grande", Verdana, sans-serif
- barva: rdeča
- velikost: 1,8 kratnik velikosti pisve
  • podnaslov:
- barva: #4b63f0
- zgornji notranji odmik: 10 pik
- zgornji podnaslov: krepka pisava
- spodnji podnaslov: podčrtan
  • moder okvir:
- barva ozadja: #8ea1f8
- notranji odmik: zgoraj in spodaj 10 pik, levo in desno 5 pik
  • oblikovne lastnosti besedila:
    • enačbe in oznake:
      • pisava: "Courier New", Monaco, monospace
      • barva besedila: #fb6466
      • levi in desni notranji odmik: 3 pike
      • velikost pisave: 1,1 kratnik velikosti pisve
    • podčrtana nagnjena pisava:
      • nagnjenost pisave: nagnjeno besedilo
      • barva besedila: #aaa
      • podčrtava: debelina 1 pika, pikčasta črta spodaj, barva #bbb
    • poudarjena pisava:
      • pisava: krepko
    • siv odstavek:
      • barva pisave: #929292
  • besedilo spodaj address:
- barva besedila: #969696
- velikost pisave: 0,7 kratnik velikosti pisve
- črta zgoraj: polna črta, barva #969696, debelina 1 pika
- zunanji odmik: zgoraj 1 kratnik velikosti pisave
- notranji odmik: zgoraj 5 pik

Slika spletne strani v brskalniku
Slika vaje 06: Oblikovanje besedila