Webszerkesztés
Notepad ++

9. 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 félkövérré az „Egy óra jellemző ára kb. 18 000 Ft (72 EUR).” mondatot.
Itt a 18 és a 000 közötti, illetve a 000 és a Ft közötti szóközöket cseréld le törhetetlen szóközökké.

<b>Egy óra jellemző ára kb. 18&nbsp;000&nbsp;Ft (72 EUR)</b>.

3. Szúrj be egy új bekezdést a „Nemzetközi elismertség” cím alatti felsorolás végére, a következő szöveggel: „Ld. még: tanáraink listája”.
A tanáraink listája szövegrészre állíts be hiperhivatkozást, amely mutasson a tanaraink.html oldalra.

<p>Ld. még: <a href="tanaraink.html">tanáraink listája</a></p>

4. Keresd meg az oldalon Elvira Sanchez és Anna Krotzmann neveit, és tedd dőltté.

<i>Elvira Sanchez</i>
<i>Anna Krotzmann</i>t

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

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

5. Nyisd meg a tanaraink.html fájlt.

Fájl - Megnyitás

Módosítsa a „Tanáraink listája” sorhoz tartozó jelölőt 1. szintű címsorrá.

<h2><h1>Tanáraink listája<h2></h1>

Az ez alatt lévő felsorolást alakítsd számozatlan felsorolás stílusúvá.

<ul>
	<li>Anna Krotzmann<br></li>
	<li>Elvira Sanchez<br></li>
	<li>Kovács János<br></li>
	<li>Péter Ádám<br></li>
	<li>Zsombor Csaba</li>
</ul>

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

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

6. Nyisd meg a kurzusok.txt fájlt.

Fájl - Megnyitás

Helyezd át a táblázatban „Svéd haladó” sorát a „Spanyol kezdő” sora után.

<tr>
	<td>Svéd haladó</td>
	<td>október 10.</td>
	<td>3*3 óra, összesen 180 óra</td>
</tr>
jelöld ki a fenti részt, C + x
lépj a „Spanyol kezdő” sora után, C + v

Módosítsd a „Kínai haladó”-t „Kínai kezdő”-re, a hozzá tartozó kezdési időpont november 12. legyen.

<td>Kínai haladó kezdő</td>
<td>október 5. november 12.</td>

7. Alakítsd a táblázat első sorának a celláit fejléc cella típusúvá.
Itt a cellaegyesítést szűntesd meg, az egyiknek „Kezdési időpont”, a másiknak „Időtartam” legyen a tartalma.

<td><th>Kurzus</td></th>
<td colspan="2"><th>Kezdési időpont és időtartam</td></th>
<th>Időtartam</th>

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

<html>
<head>
<meta charset="utf-8">
...
<title>Robohal nyelviskola</title>
</head>
...
</body>
</html>

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

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

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

Fájl - Megnyitás

Szúrj be egy új űrlapelemet a Név és a Nyelv, ami érdekli közé. A felirata legyen Email cím:, a beviteli mező típusa pedig legyen egysoros szöveges.

<p><div>E-mail:</div><div><input type="text"></div></p>

10. Egészítsd ki a nyelvek listáját a következő választási lehetőséggel: egyéb.

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

Az űrlapelem paramétereit módosítsd úgy, hogy lista helyett legördülő legyen.

<select name="nyelv" size="10">

11. Módosítsd az Üzenet melletti beviteli mező paramétereit úgy, hogy a sorok száma 5, a soron belüli karakterek száma 40 legyen.
A mezőbe legyen alapértelmezetten a következő szöveg: „Ide írja az üzenetét.”

<textarea name="uzenet" rows="5" cols="40">Ide írja az üzenetét.</textarea>

Mentsd el és zárd be a kapcsolat.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 esetén a háttér képe: vonal_fuggoleges.gif legyen, amit y tengely mentén ismételjen.

???
#tartalom{
	width:750px;
	padding-left: 50px;
	float: right;
	background: url('vonal_fuggoleges.gif') repeat-y; 
}

13. Egészítsd ki az alja azonosítójú elemre vonatkozó szabályt a következőkkel: betű mérete a szülő elem betűméretének 0.8-szorosa, a szöveg pedig legyen középre igazítva.

#alja{
	clear: both;
	font-size:0.8em;
	text-align: center;
}

14. Egészítsd ki a table elemekre vonatkozó szabályt a következőkkel: A felső és alsó margó legyen 10 pixel, a bal- és jobboldali margót pedig állítsd be úgy, hogy az elem középre rendeződjön.

table{
	border-collapse: collapse;
	margin: 10px auto;
}

15. Adj keret tulajdonságot a th és td elemeknek: vastagsága legyen 2 pixel, színe fekete (black), a mintázata pedig pontozott.

th, td{
	padding: 3px 8px;
	border: 2px dotted black;
}

16. Minden text típusú beviteli mező szélessége legyen 280 pixel.

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

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