Webszerkesztés
Notepad ++

49. 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é és dőltté a szövegben található „Ponta de Sagres” és az „Algarve” kifejezéseket.

<b><i>Ponta de Sagres</i></b>
<b><i>Algarve</i></b>

3. Állíts be hiperhivatkozást a „foglalja le” szövegrészre, amely mutasson a Foglalás című oldalra.

<a href="foglalas.html">foglalja le</a>

Állíts be hiperhivatkozást a „Lépjen velünk kapcsolatba” szövegrészre is, ez mutasson a kapcsolat.html oldalra

<a href="kapcsolat.html">Lépjen velünk kapcsolatba</a>

4. Állítsd be az oldalon található hotel.jpg kép megjelenési magasságát 164 pixelre. Adj alternatív szöveget a képnek „Cape Hotel” értékkel.

<img src="hotel.jpg" height="164" alt="Cape Hotel">

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

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

5. Nyisd meg a szolg.txt fájlt.

Fájl - Megnyitás

Egészítsd ki a fájlt a hiányzó body nyitó és záró jelölőivel. Adj oldalcímet „Cape Hotel” értékkel.

<title>Cape Hotel</title>
</head>
<body>
...
</body>
</html>

6. A „Szolgáltatásaink” alatti sorokat alakítsd számozatlan felsorolás stílusúvá.

<ul>
	<li>Szauna</li>
	...
	<li>Aromaterápia</li>
</ul>

7. Javítsd az oldalon található képfájl nevét, a megjelenési szélességét pedig 425 pixelben határozd meg.

<img src="pool.jpg" width="425" alt="medence">

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

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

8. Nyisd meg a szobak.html fájlt.

Fájl - Megnyitás

„A fürdőszoba...” kezdetű mondat elé szúrj be egy sortörést.

biztosított.<br> A fürdőszoba

„Az alábbi táblázat...” kezdetű mondat pedig kerüljön új bekezdésbe.

relaxálást.</p> <p>Az alábbi

9. Az oldalon lévő táblázat első sorát és első oszlopát alakítsd fejléc cella típusúvá.

<td><th>Árak (/szoba/éj)</td></th>
<td><th>Kétágyas</td></th>
<td><th>Egyágyas</td></th>
...
<td><th>január - március</td></th>
<td><th>április - június</td></th>
<td><th>július - szeptember</td></th>
<td><th>október - december</td></th>

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

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

10. Nyisd meg a foglalas.html fájlt.

Fájl - Megnyitás

A „Hotel” felirathoz tartozó űrlapelemet módosítsd úgy, hogy minden értéke látszódjon, alapértelmezésben pedig a „Cape Hotel” legyen kiválasztott állapotban.

<select name="hotel" size="4">
...
	<option value="ch" selected>Cape Hotel</option>

11. A „Különleges kérések” felirathoz tartozó beviteli mező legyen többsoros, sorainak száma 5, a soron belüli karakterek száma pedig 50 legyen.

<input type="text" textarea rows="5" cols="50" name="keres">

Mentsd el és zárd be az foglalas.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ú elemen belüli h3 elemekre a betűméretet határozd meg 24 pixelben, a szövegigazítás pedig középre történjen.

#tartalom h3{
	font-size: 1.2em24px;
	text-align: center;
}

13. A th elemekhez rendelj 5 pixel méretű felső és alsó, valamint 10 pixel bal- és jobboldali bélés (padding) értékeket.

th{
	background-color: #eee;
	padding: 5px 10px;
}

14. A td elemeknél a szöveg jobbra igazodjon.

td{
	text-align: right;
}

15. A caption elemekben a betűvastagság legyen félkövér.

caption{
	font-weight: bold;
}

16. A submit típusú nyomógombok szélességét állítsd 80 pixel méretűre.

input[type="submit"]{
	width: 80px;	
}

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: