Veronika Dropčová
veronika.dropcova(at)gmail.com

   nika.blog.matfyz.sk

10 – CSS – Finálne zadanie 1

Design „cítim sa ako ovečka“

Stiahnite si podklady k tejto stránke.

Celý obsah stránky

  1. Zabezpečte, aby celý obsah stránky bol od krajov vzdialený vo vertikálnom smere 50px a v horizontálnom smere 100px.
  2. Nastavte veľkosť písma na 120% a typ písma na Verdanu, resp. jemu príbuzné písma.
  3. Farba pozadia celej stránky bude #FF9e77.

 

Hlavička

  1. Na pozadí bude obrázok sheep.png, ktorý sa nebude opakovať a bude umiestnený vľavo hore.
  2. Farba pozadia bude #FF5F1F.
  3. Nastavte výšku hlavičky na 150px.
  4. Zabezpečte, aby obsah hlavičky bol od jej okrajov vzdialený vo vertikálnom smere o 0 a v horizontálnom smere o 10px.
  5. Nadpis v hlavičke má byť veľkosti 3.5 znaku, jeho farba má byť #FAE8D6, bude zarovnaný vpravo a bude veľkými písmenami.

 

Navigácia

  1. Obsah navigácie bude od jej vnútorných okrajov vzdialený o 1 znak.
  2. Farba pozadia bude #A85736.
  3. Odkazy v navigácii budú mať farbu #FAE8D6, budú tučné a nebudú podčiarknuté. Nastavte im vnútorné okraje vo vertikálnom semre 0.5 znaku a v horizontálnom smere 1 znak.
  4. Pri nadídení myšou nad odkazy sa im zmení farba pozadia na #D2A08D, farba textu sa zmení na bielu a z pravej a dolnej strany sa zobrazí rámček hrubý 5px a farby #FAE8D6 (pozri ukážku).

 

Hlavná časť stránky (sekcia)

  1. Farba pozadia bude #FFFFCC.
  2. Prvá veta v tejto časti na stránke index.html (Táto stránka poslúži…) bude mať nastavenú veľkosť písma na 1.2 znaku.
  3. Prvá veta v tejto časti na stránke tabulka.html (Tak tu máme niekoľko…) bude zdola orámovaná rámčekom hrúbky 5px, štýlom ridge a farbou #A85736. Zároveň jej nastavte vzdialenosť od tohto dolného orámovania na 1.8 znaku.
  4. Zoznam v tejto časti stránky bude mať odrážky typu circle.

 

Dolná časť stránky (aside)

  1. Farba pozadia bude #D2A08D.
  2. Text bude zarovnaný vpravo.
  3. Nadpis v tejto časti bude farby #FAE8D6, zarovnaný vpravo a medzery medzi písmenami budú 0.5 znaku.
  4. Názvy jednotlivých dizajnov budú tučným písmom farby #FF5F1F. Po nadídení myšou ponad ne sa zmení ich farba na #BD5E00.

 

Pätička

  1. Farba písma bude #FAE8D6, text bude zarovnaný vpravo a veľkosť písma bude menšia.
  2. Farba pozadia bude #A85736.

 

Tabuľka

  1. Každý riadok tabuľky bude zdola ohraničený čiarou hrúbky 2px typu ridge a farbou #D2A08D.
  2. Veľkosť písma bude 0.9 znaku.
  3. Šírka tabuľky bude 50%.
  4. Text v tabuľke bude vycentrovaný.
  5. Obrázky v tabuľke budú mať nastavené vonkajšie medzery na 10px.
  6. Šírka prvého stĺpca tabuľky bude 210px.

 

A ešte…

  1. Zabezpečte, aby obsah hlavnej časti stránky, dolnej časti stránky a pätičky bol od okraja vzdialený o 1%.

1-11-4  1-2 1-3

 

 

 

 

 

Pridaj komentár

Vaša e-mailová adresa nebude zverejnená. Vyžadované polia sú označené *