Készíts weboldalt az országos kéktúráról.

A weboldal öt lapból álljon. A weblapok alap formátuma mind az öt esetben megegyezik, csak a tartalom rész tér el.

Alap elkészítése

Az oldalak háttere #012333, a betűk színe fehér.

A linkek színe minden esetben fehér, kivéve a meglátogatott linket, melynek színe #CCFFFF.

Az oldalak fejléce egy 2 soros és 4 oszlopos, szegély nélküli, vízszintesen középre igazított, 80% széles táblázat. Cellamargó 1, cellaköz 2 képpont.

Az első sor cellái egyesítettek, a sor magasság 140 képpont. Az egyesített cella háttere a cimHatter.jpg kép.

Balra igazítva helyezkedik el a logo_uj.png kép, a szöveg jobbról futja körbe, a vízszintes margó 10 képpont.

Mellette a felirat a minta alapján, 18 és 36 képpontos betűméretű, betűtípusa Courier New.

A második sorban az egyes weboldalra mutató linkeket kell begépelni. Ez a sor 20 képpont magas, háttérszíne #395567, a linkek középre vannak igazítva, large betűmérettel és Courier New félkövér betűtípussal.

Az első oldal az index.html. Az első sorban lévő logo-ra kattintva minden oldalról ide jutunk.

A többi oldal turainfo.html, szakaszok.html, tortenet.html, belyegzofuzet.html. A linkek a megfelelő oldalra mutatnak.

Közvetlenül a címrész alatt helyezkedik el egy másik táblázat 4 oszloppal és 4 sorral, szegély nélkül, 80% széles és középre igazított. Cellaköz 2, cellamargó 15 képpont, háttere a db_dark.jpg. A cellákat a lapokon különféleképpen kell majd összevonni.

Minta:

index.html

Alapja a fentebb leírt oldal.

A böngésző címsorában a Kéktúra cím jelenjen meg.

Az első sor cellái összevontak és a mintán látható szöveg szerepel benne. Betűméret xx-large. Keress hasonló betűtípust a mintán láthatóhoz.

Minta:

A 2. sorban két 50% széles cellát alakítunk ki, ugyanígy a 3. sorban is. A 4. sor üresen marad.

Másold be a megfelelő szöveget, és formázd a minta alapján!

Az alcímek kettes szintű címsorral, Courier New betűtípussal íródnak, a szöveg Arial, Helvetica, sans-serif betűtípussal, 14 pont betűmérettel.

Bal alsó cellában lévő felsorolás listajele a pötty legyen.

Jobb alsó cellába a Kekturabelyegzesipont.jpg képet illeszd középre igazítva, arányosan kicsinyítve, hogy a mintához hasonlítson.

Minta:

turainfo.html

Alapja a fentebb leírt oldal.

A böngésző címsorában a Túrainfó cím jelenjen meg.

Az első sor cellái összevontak és a mintán látható szöveg szerepel benne, egyes szintű címsorként, Courier New betűtípussal, középre igazítva.

A 2. sor cellái szintén összevontak és a kektura_terkep2.png kép helyezkedik el benne középre igazítva.

A 3. sorban alakítsd ki úgy a cellákat, hogy a szöveget a minta alapján el tudd helyezni.

A szöveg formátuma: Alcím kettes szintű címsor, Courier New betűtípussal. A szöveg többi része Arial, Helvetica, sans-serif betűtípusú, 14 pont betűmérettel. A bal oldali szöveg elején a kekturajelzes.png kép helyezkedik el, szélessége 52, magassága 31 képpont, a vízszintes margó 5 pixel.

Az utolsó sor üres.

Minta: 

 

szakaszok.html

Alapja a fentebb leírt oldal.

A böngésző címsorában a Szakaszok cím jelenjen meg.

A táblázat első sorában (cella összevonás után) középen a Szakaszok szöveg egyes szintű címsor, középre igazított, Courier New betűtípusú.

Második sorban megfelelő átalakítások után a minta alapján illeszd be és tagold, formázd a szöveget. Betűméret és betűtípus ugyanaz, mint az előző oldalakon.

Minta:

A 3. sorban a cellaegyesítés után egy 5 oszlopos és 30 soros táblázatot kell kialakítani.

Segítségül a táblázat html kódját megtalálod a forrásban, ezt illeszd be a szakaszok.html oldal kódjába, a megfelelő helyre.

Formázd a táblázatot a minta és a leírás alapján: a használt betűtípusok Courier New és Arial, betűméret 14 pont. Első sor félkövér, középre igazított, alatta dupla vonalas szegély, a többi sor között egy vonalas szegély van. Legalul nincs szegély.

Minta:

 

tortenet.html

Alapja a fentebb leírt oldal.

A böngésző címsorában a Történet cím jelenjen meg.

A cím, alcím és a szöveg formátuma ugyanaz, mint az előző oldalakon.

Úgy vond össze a cellákat, hogy a mintán látható módon be tudd illeszteni a tartalmat.

Az első kép a kekturaLTE.jpg, a második kép a pecsetelohely.jpg. A képek vízszintes margója 10 pixel. 180x220 képpont illetve 180x239 képpont méretűek.

Minta:

belyegzofuzet.html

Alapja a fentebb leírt oldal.

A böngésző címsorában a Bélyegzőfüzet cím jelenjen meg.

Az első három sorba alakítsd úgy a cellaösszevonásokat, hogy be tudd illeszteni a tartalmat a mintának megfelelően.

Betűtípus és méret ugyanaz, mint az előző oldalnál.

A felsorolás előtti sor hármas szintű címsor és Courier New betűtípusú.

A felsorolás listajele üres kör legyen.

A okt_cimlap_uj.png kép egy külön cellába van beillesztve és középre igazítva.