Webszerkesztés
Notepad ++

32. feladatsor


Indíts el a Notepad++ webszerkesztő programot.

2. Nyisd meg az index.html nevű fájlt a megadott helyről.

Fájl - Megnyitás

Tedd az „Üdvözlöm Önt cégünk nevében!” sort 1. szintű címsor típusúvá.

<p><h1>Üdvözlöm Önt cégünk nevében!</p></h1>

A „Reméljük, hamarosan...” mondat elé tegyél sortörést.

szerelékekről is.<br /> Reméljük,

3. Szúrd be a map.gif képet a kep_kozep osztályú elemen belülre. A képhez adj alternatív szöveget térkép értékkel.

<p class="kep_kozep"><img src="map.gif" alt="térkép">

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

Fájl - Mentés
Fájl - Bezárás

4. Nyisd meg az idojaras.txt fájlt.

Fájl - Megnyitás

Egészítsd ki a fájlt a hiányzó html nyitó és záró jelölőivel. Adj oldalcímet a következő szöveggel: „Csendes Víz horgásztó”.

<html>
</head>
...
<title>Csendes Víz horgásztó</title>
<head>
...
</body>
</html>

5. Tedd félkövérré „A változó felhőzet”, valamint „A sok napsütés” szövegrészeket.

<b>változó felhőzet</b>
<b>sok napsütés</b>

6. A „Várható hőmérséklet” szövegrészeket mindkét előfordulásnál alakítsd dőltté.

<i>Várható hőmérséklet</i>

Mentsd el a fájlt weboldalként idojaras.html néven és zárd be.

Fájl - Mentés másként...
Fájltípus: (*.html)
Fájl - Bezárás

7. Nyisd meg az eszkozok.html fájlt.

Fájl - Megnyitás

Adj táblázatcímet (caption) az oldalon lévő táblázatnak „Minőségi botok kedvező áron” szöveggel.

<table>
	<caption>Minőségi botok kedvező áron</caption>

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

Fájl - Mentés
Fájl - Bezárás

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

Fájl - Megnyitás

Az „Információ” címsor alatti, űrlapig tartó sorokat alakítsa definíciós listává.

<dl>
<p><dt>Szabályok</p></dt>
	<p><dd>OHR, pergetés tilos.<br>
	Védett faj: compó.</p></dd>
...
<p><dt>Jegyárak</p></dt>>
	<p><dd>5 000 Ft (hétvégi, ünnepi, éjszakai 8 000 Ft.</p></dd>
</dl>

9. Az űrlap Kategória felirathoz tartozó mezőjéhez vegyél fel egy új választható értéket egyéb szöveggel.

	<option value="egyeb">egyéb</option>
</select>

Az űrlapelem paramétereit változtasd meg úgy, hogy lenyíló legyen.

<select name="kategoria" size="3">

10. Az Üzenet felirathoz tartozó beviteli mező paramétereit módosítsd úgy, hogy a sorok száma 5, a soron belüli karakterek száma 50 legyen. A szövegmezőbe alapértelmezetten „Írj valamit!” szöveg jelenjen meg.

<textarea name="uzenet" rows="5" cols="50">Írj valamit!</textarea>

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

<input type="reset" name="torles" value="adatok törlése">

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

Fájl - Mentés
Fájl - Bezárás

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

Fájl - Megnyitás

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 állapotánál a betű színe sárga (yellow) legyen és aláhúzott.

#menu a:hover{
	text-decoration: noneunderline;
	color: yellow;
}

13. A table elemek felső és alsó margója legyen 0 méretű, a bal- és jobboldali margót állítsd be úgy, hogy az elem középre igazodjon.

table{
	width: 90%;
	margin: 0 auto;
}

14. A td elemek számára határozz meg keret tulajdonságot, amely 1 pixel vastag, szaggatott mintázatú és #888 színű.

td{
	padding: 3px;
	border: 1px dashed #888;
}

15. A legend elemekre a betűstílust állítsd félkövérre.

legend{
	font-weight: bold;
}

16. A text típusú input elemek szélessége legyen 300 pixel.

input[type="text"]{
	width: 300px;
}

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

Fájl - Mentés
Fájl - Mind bezárása
Fájl - Kilépés

Az elkészült weboldal: