A minta és a leírás alapján készítsük el az nsa.css állományt, a snowden.html lap formázásához. A feladat az alábbi cikk alapján készült: http://index.hu/kulfold/2013/07/22/minden_ami_snowden/
Források
FeladatokAz oldal szerkezete- Az oldal tartalma egy 640 képpont széles, középre igazított DIV-ben van (container). Ennek belső margói jobbra és balra 10 képpont, fent 16 képpont.
- Ennek részei: a bevezetés (intro), amiben a szerzők (authors) és a rövid összefoglaló (abstract) szerepelnek, a cikk (article) és a lábléc (footer).
- A szerzők doboza alá van húzva (alsó szegély) egy 1 képpontos, folytonos szürke vonallal. Alsó margója 15 képpont, alsó belső margója 5 képpont.
- A láblécnek felső szegélye van, ami két képpont vastag, folytonos narancssárga vonal. Alsó és felső margója 15 képpont, alsó és felső belső margója 5 képpont.
- A szöveg bekezdésekre tagolódik.
- A képek külön DIV-ben vannak (kep), amihez tartozik egy kép aláírás (kepfelirat). Ezek osztályok és nem egyedi azonosítók, mert több kép is szerepel az oldalon.
- A rövid bevezető belső margói 20 képpontosak.
- A képek doboza 620 képpont szélesek, középre igazítottak.
- A bekezdések alsó és felső margója 16 képpont.
- A képfelirat bekezdések felső margója 0 képpont, felső és alsó belső margója 8 képpont.
Színek- Az oldal szürke hátterű: #f1f1f1
- A képek bekezdése szintén szürke hátterű: #f1f1f1
- A szerzők alatt a dátum betűszíne, és a képfeliratok betűszíne: #666
- A dátum alatti vonal színe: #ccc
- A cikk végén a lábléc szegélyének színe: #f60
- A hivatkozások színe alaphelyzetben: #24468a
- A hivatkozások színe, amikor az egér fölöttük van: #f60
Betűtípusok és méretek- Az egész oldal Arial vagy sans-serif betűtípusú, 15 képpontos karakterekkel.
- Az egyes címsor 26 képpontos, a kettes címsor 18 képpontos.
- A rövid bevezető összefoglaló félkövér.
- A képfeliratok bekezdésének szövege középre igazított, betűmérete 13 képpont.
Képek elrendezése- A képek egy-egy DIV-be vannak zárva, 1 képpontos szegéllyel vannak határolva.
- A képek megjelenítési szélessége 620 képpont.
Hivatkozások- A hivatkozások alaphelyzetben nincsenek aláhúzva és kékek. Amikor az egér föléjük megy, narancssárgára váltanak és megjelenik az aláhúzás.
Listák- A lista felsorolás szimbóluma kis fekete négyzet (square).
Minta |
|
