A következő feladatban egy weboldalt kell készítenie a Rubik-kocka rövid bemutatására a feladatleírás és a minta szerint. A feladat megoldása során a következő állományokat kell felhasználnia: hatterkocka.png, sematikus.png, forras.txt, rubik.css. Ahol a feladat másként nem kéri, a formázási beállításokat a rubik.css stílusállományban végezze el!
1. Hozzon létre HTML oldalt rubik.html néven! Állítsa be az oldal nyelvét magyarra és a kódolását UTF-8-ra!
2. A böngésző címsorában megjelenő cím „Rubik-kocka” legyen!
3. A weboldal fejrészében helyezzen el hivatkozást a rubik.css stíluslapra!
4. Állítsa be a stíluslapon, hogy a weboldal háttérképe a hatterkocka.png kép legyen!
5. Az oldal törzsébe másolja be az UTF-8 kódolású forras.txt állomány tartalmát!
6. Alakítsa ki a címet, alcímeket a minta szerint! A weboldal címe „Rubik-kocka” 1-es szintű címsor, az alcímek „Variációk száma”, „Kirakási metódusok” pedig 2-es szintű címsorok legyenek!
7. Módosítsa a stílusbeállításokat a stíluslapon úgy, hogy minden szöveg barnás színű (#443502 színkódú) legyen!
8. Alakítsa ki a szöveg bekezdéseit a minta szerint!
9. Módosítsa a stílusbeállításokat a stíluslapon úgy, hogy a bekezdések körül minden irányban 5 pixel vastagságú külső margó legyen!
10. Az 1-es szintű címsor mellé balra helyezze el a sematikus.png képet és formázza a stíluslap cimkep azonosító kijelölőjének felhasználásával! Ha a kép fölé visszük az egeret, vagy a kép valamiért nem jeleníthető meg, akkor mindkét esetben a „Rubik- kocka” szöveg jelenjen meg!
11. Módosítsa a stílusbeállításokat a stíluslapon úgy, hogy a cimkep azonosító kijelölővel formázott elem magassága 150 pixel legyen!
12. Az első alcímet „Variációk száma” és az azt követő bekezdést a stíluslap jobbra osztálykijelölőjének felhasználásával igazítsa jobbra!
13. „Az oldalakat elforgatva sokféle...” kezdetű bekezdésben a variációk számának hatvány formában felírt közelítő értékénél állítson be felső indexet a minta szerint (43*1018)!
14. A „Ha az ember minden...” kezdetű bekezdést formázza a stíluslap erdekesseg osztálykijelölőjének felhasználásával!
15. Módosítsa a stílusbeállításokat a stíluslapon úgy, hogy az erdekesseg osztálykijelölővel formázott elemek szövege dőlt betűstílusú és fehér háttérszínű legyen!
16. Alakítsa ki a minta szerinti számozatlan felsorolást a szövegben a „Tucatnyi metódust” kezdetű bekezdés alatt! Állítsa be a stíluslapon, hogy a felsorolás jele négyzet legyen!
17. Mindhárom listaelemen belül két bekezdést alakítson ki (HTML bekezdés elemmel)! Az elsőt a stíluslap módosításával formázza félkövér betűstílusúra, míg a másodikat formázza a stíluslap erdekesseg osztálykijelölőjének felhasználásával!