WebmesterKE2 - ECDL vizsgafeladatok megoldásai ingyen, lépésről-lépésre!

Indíts el a Visual Studio Code webszerkesztő programot.

2. Nyisd meg az index.html fájlt.

Fájl megnyitása: a Fájlkezelőben dupla klikk a fájl nevén

A „Honlapunkon szörfölve...” szövegrésztől a szöveg kerüljön új bekezdésbe.
A „Reméljük sikerül...” mondat elé szúrj be egy sortörést.

(Az animáció indításához/leállításához kattints a képen!)

A snippets.json fájl!

3. Állíts be hiperhivatkozást a „programokat” szóra, amely mutasson a Programok című oldalra.
Állíts be hiperhivatkozást az „Ön számára legmegfelelőbb” szövegrészre is, ez mutasson az ajanlo.html oldalra.

(Az animáció indításához/leállításához kattints a képen!)

4. Cseréld le az oldalon található turizmus.jpg képet a falu.jpg képre.
Adj alternatív szöveget is a képnek „falu” értékkel.

(Az animáció indításához/leállításához kattints a képen!)

Mentsd el és zárd be az index.html fájlt.

Mentés: C+s
Fájl bezárása: C+É

5. Nyisd meg a kapcsolat.txt fájlt.
Mentsd el a fájlt weboldalként kapcsolat.html néven.

(Az animáció indításához/leállításához kattints a képen!)

Fájl megnyitása: a Fájlkezelőben dupla klikk a fájl nevén

Egészítsd ki a fájlt a hiányzó html és head nyitó és záró jelölőivel.

(Az animáció indításához/leállításához kattints a képen!)

6. Alakítsd át a Kapcsolat címsor alatti sorokat számozatlan felsorolás stílusúvá.

(Az animáció indításához/leállításához kattints a képen!)

Mentsd el a fájlt és zárd be.

Mentés: C+s
Fájl bezárása: C+É

7. Nyisd meg a programok.html fájlt.

Fájl megnyitása: a Fájlkezelőben dupla klikk a fájl nevén

A táblázat első sorának celláit módosítsd fejléc cella típusúvá.

(Az animáció indításához/leállításához kattints a képen!)

8. Rendezd a táblázat sorait a dátum oszlopa szerint növekvő sorrendbe.

(Az animáció indításához/leállításához kattints a képen!)

Mentsd el és zárd be a programok.html fájlt.

Mentés: C+s
Fájl bezárása: C+É

9. Nyisd meg az ajanlo.html fájlt.

Fájl megnyitása: a Fájlkezelőben dupla klikk a fájl nevén

Szúrj be egy új sort az űrlapba Email cím felirattal, a mező típusa egysoros szöveges beviteli mező legyen.

(Az animáció indításához/leállításához kattints a képen!)

10 Az űrlapon található jelölőnégyzetekhez tartozó szöveget alakítsd címke (label) típusúvá.

(Az animáció indításához/leállításához kattints a képen!)

11. Az űrlap végén található nyomógombot módosítsd submit típusúra, a felirata pedig „Küldés” legyen.

(Az animáció indításához/leállításához kattints a képen!)

Mentsd el és zárd be az ajanlo.html fájlt.

Mentés: C+s
Fájl bezárása: C+É

12. Nyisd meg a styles.css fájlt.

Fájl megnyitása: a Fájlkezelőben dupla klikk a fájl nevén

Módosítsd a CSS szabályokat az alábbiak szerint:
A menu azonosítójú elemen belüli hivatkozás jelölő elemek hover állapota esetén a betűszín legyen #c6c.

(Az animáció indításához/leállításához kattints a képen!)

13. A kep osztályú elemek img gyermekelemeinél a szélesség 300 pixel, a margó mérete 10 pixel legyen.

(Az animáció indításához/leállításához kattints a képen!)

14. A td elemek alsó kerete legyen 3 pixel vastag, pontozott mintázatú és #060 színű.

(Az animáció indításához/leállításához kattints a képen!)

A snippets.json fájl!

15. A fieldset elemek bélése (padding) egységesen legyen 15 pixel.

(Az animáció indításához/leállításához kattints a képen!)

16. A submit típusú input elemek háttérszíne legyen #c6c.

(Az animáció indításához/leállításához kattints a képen!)

Ments és zárj be minden fájlt és zárj be minden alkalmazást.

Mentés: C+s
Fájl bezárása: C+É
Webszerkesztő bezárása: A+É

Az elkészült weboldal:

index.html programok.html ajanlo.html kapcsolat.html

Webszerkesztés
Visual Studio Code

21. feladatsor

2. Nyisd meg az index.html fájlt.

A „Honlapunkon szörfölve...” szövegrésztől a szöveg kerüljön új bekezdésbe.
A „Reméljük sikerül...” mondat elé szúrj be egy sortörést.

3. Állíts be hiperhivatkozást a „programokat” szóra, amely mutasson a Programok című oldalra.
Állíts be hiperhivatkozást az „Ön számára legmegfelelőbb” szövegrészre is, ez mutasson az ajanlo.html oldalra.

4. Cseréld le az oldalon található turizmus.jpg képet a falu.jpg képre.
Adj alternatív szöveget is a képnek „falu” értékkel.

Mentsd el és zárd be az index.html fájlt.

5. Nyisd meg a kapcsolat.txt fájlt.
Mentsd el a fájlt weboldalként kapcsolat.html néven.

Egészítsd ki a fájlt a hiányzó html és head nyitó és záró jelölőivel.

6. Alakítsd át a Kapcsolat címsor alatti sorokat számozatlan felsorolás stílusúvá.

Mentsd el a fájlt és zárd be.

7. Nyisd meg a programok.html fájlt.

A táblázat első sorának celláit módosítsd fejléc cella típusúvá.

8. Rendezd a táblázat sorait a dátum oszlopa szerint növekvő sorrendbe.

Mentsd el és zárd be a programok.html fájlt.

9. Nyisd meg az ajanlo.html fájlt.

Szúrj be egy új sort az űrlapba Email cím felirattal, a mező típusa egysoros szöveges beviteli mező legyen.

10 Az űrlapon található jelölőnégyzetekhez tartozó szöveget alakítsd címke (label) típusúvá.

11. Az űrlap végén található nyomógombot módosítsd submit típusúra, a felirata pedig „Küldés” legyen.

Mentsd el és zárd be az ajanlo.html fájlt.

12. Nyisd meg a styles.css fájlt.

Módosítsd a CSS szabályokat az alábbiak szerint:
A menu azonosítójú elemen belüli hivatkozás jelölő elemek hover állapota esetén a betűszín legyen #c6c.

13. A kep osztályú elemek img gyermekelemeinél a szélesség 300 pixel, a margó mérete 10 pixel legyen.

14. A td elemek alsó kerete legyen 3 pixel vastag, pontozott mintázatú és #060 színű.

15. A fieldset elemek bélése (padding) egységesen legyen 15 pixel.

16. A submit típusú input elemek háttérszíne legyen #c6c.

Ments és zárj be minden fájlt és zárj be minden alkalmazást.

Az elkészült weboldal:

21. feladatsor

2. Nyisd meg az index.html fájlt.

A „Honlapunkon szörfölve...” szövegrésztől a szöveg kerüljön új bekezdésbe. A „Reméljük sikerül...” mondat elé szúrj be egy sortörést.

3. Állíts be hiperhivatkozást a „programokat” szóra, amely mutasson a Programok című oldalra. Állíts be hiperhivatkozást az „Ön számára legmegfelelőbb” szövegrészre is, ez mutasson az ajanlo.html oldalra.

4. Cseréld le az oldalon található turizmus.jpg képet a falu.jpg képre. Adj alternatív szöveget is a képnek „falu” értékkel.

Mentsd el és zárd be az index.html fájlt.

5. Nyisd meg a kapcsolat.txt fájlt. Mentsd el a fájlt weboldalként kapcsolat.html néven.

Egészítsd ki a fájlt a hiányzó html és head nyitó és záró jelölőivel.

6. Alakítsd át a Kapcsolat címsor alatti sorokat számozatlan felsorolás stílusúvá.

Mentsd el a fájlt és zárd be.

7. Nyisd meg a programok.html fájlt.

A táblázat első sorának celláit módosítsd fejléc cella típusúvá.

8. Rendezd a táblázat sorait a dátum oszlopa szerint növekvő sorrendbe.

Mentsd el és zárd be a programok.html fájlt.

9. Nyisd meg az ajanlo.html fájlt.

Szúrj be egy új sort az űrlapba Email cím felirattal, a mező típusa egysoros szöveges beviteli mező legyen.

10 Az űrlapon található jelölőnégyzetekhez tartozó szöveget alakítsd címke (label) típusúvá.

11. Az űrlap végén található nyomógombot módosítsd submit típusúra, a felirata pedig „Küldés” legyen.

Mentsd el és zárd be az ajanlo.html fájlt.

12. Nyisd meg a styles.css fájlt.

Módosítsd a CSS szabályokat az alábbiak szerint: A menu azonosítójú elemen belüli hivatkozás jelölő elemek hover állapota esetén a betűszín legyen #c6c.

13. A kep osztályú elemek img gyermekelemeinél a szélesség 300 pixel, a margó mérete 10 pixel legyen.

14. A td elemek alsó kerete legyen 3 pixel vastag, pontozott mintázatú és #060 színű.

15. A fieldset elemek bélése (padding) egységesen legyen 15 pixel.

16. A submit típusú input elemek háttérszíne legyen #c6c.

Ments és zárj be minden fájlt és zárj be minden alkalmazást.

Az elkészült weboldal:

A „Honlapunkon szörfölve...” szövegrésztől a szöveg kerüljön új bekezdésbe.
A „Reméljük sikerül...” mondat elé szúrj be egy sortörést.

3. Állíts be hiperhivatkozást a „programokat” szóra, amely mutasson a Programok című oldalra.
Állíts be hiperhivatkozást az „Ön számára legmegfelelőbb” szövegrészre is, ez mutasson az ajanlo.html oldalra.

4. Cseréld le az oldalon található turizmus.jpg képet a falu.jpg képre.
Adj alternatív szöveget is a képnek „falu” értékkel.

5. Nyisd meg a kapcsolat.txt fájlt.
Mentsd el a fájlt weboldalként kapcsolat.html néven.

Módosítsd a CSS szabályokat az alábbiak szerint:
A menu azonosítójú elemen belüli hivatkozás jelölő elemek hover állapota esetén a betűszín legyen #c6c.