Webszerkesztés
Visual Studio Code

---

1/1. Egy weboldalon a gyors letöltés céljából melyik a legalkalmasabb videoformátum típus?

a. – AVI b. – FLV c. – DVD d. – VCD

1/2. Mire szolgál a HTML állományokban az <img src="..."> jelölő?

a. – kép beillesztésére b. – hang fájl beillesztésére c. – letöltendő dokumentum beillesztésére d. – oldaltérkép beillesztésére

1/3. Az alábbiak közül melyik állítás igaz?

a. – A HTML weboldalak létrehozásához használatos leíró nyelv. b. – Egy CSS stíluslap fájlt csak egyetlen HTML fájlhoz lehet hozzárendelni. c. – Azért van szükség CSS stíluslapra, mert a tartalom és megjelenés csak külön helyen tárolható. d. – A HTML weboldalakat kizárólag webszervereken tudunk tárolni.

1/4. Milyen jelölőt kell használni a weboldalak táblázataiban a táblázat egy-egy sorának meghatározására?

a. – <th> jelölőt b. – <td> jelölőt c. – <tr> jelölőt d. – <hr> jelölőt

1/5. Mire használjuk az űrlapoknál az <input type="submit"> jelölőt?

a. – szöveges beviteli mező elhelyezésére b. – „űrlap elküldése” gomb elhelyezésére c. – jelölőnégyzet elhelyezésére d. – kiválasztó lista elhelyezésére

1/6. Hogyan formázza át a weboldal kinézetét a következő CSS szabály? p.kiemelt{font-weight:bold;}

a. – Minden <p class="kiemelt"> bekezdés szövege dőlt. b. – Minden bekezdés szövege félkövér. c. – A dokumentum teljes szövege félkövér. d. – Minden <p class="kiemelt"> bekezdés szövege félkövér.

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

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

A „Bemutatkozás” sort alakítsd 1. szintű címsorrá.
Az „Üdvözöljük fodrászatunkban!” sort töröld ki.

3. Alakítsd félkövérré a cím alatti első bekezdés szövegét.
A „Szombati napon...” kezdetű mondatot tedd félkövérré és dőltté.

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

4. 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 nyitó és záró jelölőivel.

Adj oldalcímet a fájlnak, „Fodor & Bodor fodrászat” néven.

5. Alakítsd a szövegben az „Elérhetőség:”-től kezdődő felsorolást definíciós listává.

6. Állíts be hiperhivatkozást a „fodorbodor@...” email címre.
Továbbá állíts be hiperhivatkozást az „on-line felületünkön” szövegrészre is, amely mutasson a Bejelentkezés című oldalra.

7. Szúrd be a comfort.jpg képet a kep_jobbra osztályú p elemen belülre. Állítsd a kép megjelenésének magasságát 180 pixelre.

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

8. Nyisd meg az arlista.html fájlt.

A táblázat első (Szolgáltatásaim-mal kezdődő) sorát alakítsd fejléc cella típusúvá.

9. Vond össze a „Festés” szövegű cellát az alatta lévő üres cellával.

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

10. Nyisd meg a bejelentkezés.html fájlt.

„A hét mely napjára?” szöveghez tartozó mezőhöz vedd fel a szombat-ot is, mint választható érték.
Állítsd be a mezőt úgy, hogy minden sora látszódjon.

11. A submit típusú nyomógomb mellé vegyél fel egy reset típusú nyomógombot is. A gomb felirata „adatok törlése” legyen.

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

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

Módosítsd a CSS szabályokat az alábbiak szerint:
A dd elemeknél a baloldali bélés (padding) legyen 20 pixel méretű, a betű mérete pedig az alap betűméret 0,9-szerese.

13. A table elemeknek adj keretet: a keret vastagsága 2 pixel, folytonos vonalú, a színe pedig #eee.

14. A kep_jobbra osztályon belüli kép elemek felső margója legyen 5 pixel, jobboldali és alsó margója 20-20 pixel, a baloldali margó pedig 0 pixel.

15. A caption elemek bélése (padding) legyen egységesen 5 pixel, a betű stílusa félkövér.

16. Az egysoros szöveges beviteli mezők háttérszíne legyen #ccf, a mezőszélesség 300 pixel.

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

Az elkészült weboldal: