Morzekód (2024. május - idegen nyelv)
Kategória: web - emelt szint
Feladat leírása
Samuel Morse 1838-ban mutatta be az elektromos távírókészülékét. A távközlésben
a működéséhez bevezetett morzekódrendszert számos területen használták, a hajózásban és
a távírásban. Készítsen weblapot a minta és a leírás alapján, amely bemutatja
a morzekódrendszert!
- Az elkészítendő állomány neve morze.html.
- Az oldal részben formázott szövegét a szoveg.html állományban találja.
- A feladat megoldásához szükséges képek: billentyu.png, hatter.png és
SFB_Morse.jpg. A képek használata során ügyeljen arra, hogy a vizsgakönyvtár
áthelyezése után is helyesen jelenjenek meg!
A weblapot stílusokkal formázva készítse el! A stilus.css stíluslapban lévő előkészített
stílusokat használhatja, de ezekben még további beállításokat, módosításokat kell tennie.
A megoldás során formázáshoz csak a stíluslapban, vagy fejlécelemekben felsorolt vagy
létrehozott stílusok használhatók, az inline (szövegközi) stílusok megadása nem.
Részfeladatok
1. A morze.html oldalt készítse el! Ehhez a szoveg.html állományt használja fel, amely már részben formázva tartalmazza a szöveget! A böngésző címsorában a „Morzekód” szöveg jelenjen meg!
2. A weboldal fejrészében helyezzen el hivatkozást a stilus.css stíluslapra, vagy annak tartalmát a html lap fejlécbe beágyazott stílusként használja fel! Ügyeljen arra, hogy inline stílusokat nem használhat!
3. A megjelenítendő tartalom egy része megjegyzésben van a weblap kódjában. A megjegyzést szüntesse meg a tartalom megjelenítéséhez!
4. Állítsa be az oldal általános tulajdonságait!
a) A weblap háttere a hatter.png kép legyen!
b) A teljes szöveg olyan betűtípusú, amely a talp nélküli (sans-serif) betűcsaládba tartozik, a betűméret az alapértelmezett 110%-a és a betűszín sötétszürke (#444444 kódú) szín legyen, ahol a feladat mást nem kér!
c) A címeken kívüli bekezdések legyenek sorkizárt igazításúak, ha a feladat nem kér mást!
d) Az oldalon a linkek színe minden állapotban fekete legyen!
5. Az oldal többi részének váza, a mintának megfelelően egy fehér téglalapként jelenjen meg! Ezt a tartalom jelölő beállításával és alkalmazásával hozza létre!
a) A téglalap
a) háttere fehér,
b) 1100 képpont széles,
c) vízszintesen középre igazított,
d) szegély nélküli,
e) minden szöveges tartalom a bal és a jobb szélétől 10 képponttal beljebb jelenjen meg!
6. Alakítsa ki a címet és az alcímeket a minta szerint! A weboldal címe „Morzekód” egyes szintű címsor, az alcímek „Samuel Morse életrajza”, „A kódok eredete” és „A morzejelek” kettes szintű címsorok legyenek!
7. Egészítse ki a formázást, hogy az egyes és kettes szintű címsorok vörös (#FC4842 kódú) színnel jelenjenek meg!
8. A kettes szintű címsorok megjelenésének beállításai:
a) dőlt betűstílusúak,
b) hátterük a szürke (#CCCCCC kódú) szín, és
c) mind a négy belső margó legyen 20 képpontos!
9. Készítse el az első alcím előtti navigációs sort, amelynek szövegét gépelje be a minta szerint! Készítsen egyedi azonosítókat a második szintű címsorokhoz! Ezekre hozza létre a hivatkozásokat a navigációs sor megfelelő részeiről!
10. A „Samuel Morse éltrajza” alcímet követő bekezdés mellé helyezze el az SFB_Morse.jpg képet és állítsa be, hogy helyettesítő vagy alternatív szövege „Samuel Morse” legyen! A stíluslapban lévő bal osztályjelölő alkalmazásával állítsa be a képre az alábbiakat:
a) a minta szerint, a szövegtől balra jelenjen meg,
b) szegély nélküli,
c) a kép a szövegtől jobb oldalon 5 képpontos, a többi irányban 0 képpontos távolságra legyen!
11. A „A morzejelek” alcím elé helyezze el a billentyu.png képet, és állítsa be, hogy a helyettesítő vagy alternatív szövege „Távíró billentyűje” legyen! A stíluslapban lévő kozep osztályjelölő alkalmazásával állítsa be a képre az alábbiakat:
a) középre igazítottan,
b) szegély nélkül jelenjen meg!
12. Egészítse ki és formázza meg a dokumentum végén lévő morzekódtáblát tartalmazó táblázatot az alábbiak szerint:
a) A táblázat kódját egészítse ki a táblázat címével, amelynek szövege „Betűk morzekódja” legyen a minta szerint!
b) A táblázat középre igazított és 1 képpont vastag szegélyű, fekete vonal legyen a minta szerint!
c) A cellák legyenek egyforma szélesek a minta szerint, bennük a szöveg vízszintesen középre igazított, 120%-os betűméretű és félkövér stílusú legyen!
d) A táblázat első sorában, fejlécében a háttér szürke (#CCCCCC kódú), és a betűk színe vörös (#FC4842 kódú) legyen! A többi cellában a betűk színe alapértelmezett maradjon!
e) A fejléc cellájában az alsó és felső margó 10 képpont legyen!
