Webszerkesztés
Notepad ++

16. 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

Alakítsd félkövérré az „5000 irodalmi, 800 tudományos, valamint több mint 2000 mesekönyv” szövegrészt.

<b>5000 irodalmi, 800 tudományos, valamint több mint 2000 mesekönyv</b>

Tedd dőltté az „árverést tartunk” szövegrészt.

<i>árverést tartunk</i>

3. Alakítsd számozatlan felsorolás stílusúvá az „Üzletünkben a következő...” cím alatti felsorolást.

<p><ul>
	- <li>bibliográfiák<br></li>
	- <li>metszetek<br></li>
	- <li>térképek<br></li>
	- <li>lexikonok<br></li>
	- <li>szépirodalmi művek</li>
</p></ul>

4. Állíts be hiperhivatkozást a „katalógusunkban talál” szövegrészre, amely mutasson a Katalógus című oldalra.

<a href="katalogus.html">katalógusunkban</a>

Állíts be hiperhivatkozást a „rendelje meg” szövegrészre is, ez mutasson a megrendeles.html oldalra.

<a href="megrendeles.html">rendelje meg</a>

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

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

5. Nyisd meg az adokveszek.txt fájlt.

Fájl - Megnyitás

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

<html lang="hu">
<head>
...
<title>Patina Antikvárium
</head>
<body>
...
</body>
</html>

6. Alakítsd definíciós listává a az „Adok-Veszek” cím alatti felsorolást.

<p><dl>
	<dt>Adok</dt>
		<dd>életrajzi műveket,<br></dd>
		<dd>metszeteket,<br></dd>
		<dd>térképeket</dd>
	<dt>Veszek</dt>
		<dd>lexikonokat,<br></dd>
		<dd>szépirodalmi műveket</dd>
</p></dl>

Mentsd el a fájlt weboldalként adokveszek.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 a katalogus.html fájlt.

Fájl - Megnyitás

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

<td><th>könyv</td></th>
<td><th>kiadó</td></th>
<td><th>ára</td></th>

8. Szúrd be a táblázat alatt található konyv osztályú elemen belülre a konyvek.gif képfájlt.
Adj alternatív szöveget a képnek „könyvek” értékkel.

<p class="konyv"><img src="konyvek.gif" alt="könyvek"></p>

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

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

9. Nyisd meg a megrendeles.html fájlt.

Fájl - Megnyitás

Szúrj be az űrlaphoz magyarázó feliratot (legend) a következő szöveggel: „Töltse ki az alábbi űrlapot!”.

<form>
	<legend>Töltse ki az alábbi űrlapot!</legend>

10. Vegyél fel egy új rádiógombot a Kategória címszó mellé, a gombhoz tartozó címke „Szépirodalmi mű” legyen.

<input type="radio" name="kategoria" value="szepirodalom" id="szepirodalom">
<label for="szepirodalom">Szépirodalmi mű</label>

A rádiógombok közül alapértelmezetten legyen az „Életrajz” bejelölt állapotban.

<input type="radio" name="kategoria" value="eletrajz" id="eletrajz" checked>

11. Állítsd be az Üzenet felirat melletti szövegmezőt a következőképpen: sorok száma 8, a soron belüli karakterszám 40 legyen.
Alapértelmezetten a következő szöveg legyen a szövegmezőbe beleírva: „Itt üzenhet nekünk.”

<textarea name="uzenet" rows="8" cols="40">Itt üzenhet nekünk.</textarea>

Mentsd el és zárd be a megrendeles.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 tartalom azonosítójú elem h2 gyermekeleménél a betűméret legyen az alap betűméret 1,2-szerese.

#tartalom h2{
	font-size: 1.2em;
}

13. A table elemek felső és alsó margóinak nagysága legyen 20 pixel, a bal- és jobboldali margót pedig állítsd be úgy, hogy az elem középre rendeződjön.

table{
	margin: 10px20px auto;
}

14. Módosítsd a th elemre vonatkozó megjelenítési szabályt: a háttér színének #800, a betűszínnek pedig #ff0 értéket adjon meg.

th{
	color: #666#ff0;
	background-color: #800;
}

15. A fieldset elemekhez adj bélés (padding) értéket, amely egységesen 20 pixel legyen.

ilyen elem egyik oldalon sincs!
fieldset{
	padding: 20px;
}

16. Az egysoros szöveges beviteli mező szélességét határozd meg 300 pixel méretűre.

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

Mentsd é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: