Webszerkesztés
Notepad ++

47. 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 1. szintű címsorrá az „Üdvözöljük honlapunkon!”, valamint „A századok ködéből...” sorokat.

<p><h1>Üdvözöljük honlapunkon!</p></h1>
<p><h1>A századok ködéből...</p></h1>

3. Állíts be hiperhivatkozást a „konyha remekei” szövegrészre, amely mutasson a Specialitások című oldal foetelek könyvjelzőjére.

<a href="spec.html#foetelek">konyha remekei</a>

Állíts be hiperhivatkozást az „édességek” szóra is, ez mutasson a Specialitások című oldal desszertek könyvjelzőjére.

<a href="spec.html#desszertek">édességek</a>

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

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

4. Nyisd meg a business.txt fájlt.

Fájl - Megnyitás

Egészítsd ki a fájlt a hiányzó head nyitó és záró jelölőivel. Adj oldalcímet „Palmerius étterem” szöveggel.

<html lang="hu">
<head>
...
<title>Palmerius étterem</title>
</head>
<body>

5. Alakítsd számozott felsorolás stílusúvá „A menü tartalma:” alatti sorokat.

<ol>
	<li>Hideg és meleg előételek, saláták</li>
	...
	<li>Korlátlan ásványvíz fogyasztás</li>
</ol>

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

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

6. Nyisd meg a spec.html fájlt.

Fájl - Megnyitás

Szúrj be horgonyt (könyvjelzőt) a Főételek táblázata elé „foetelek” értékkel, valamint a Desszertek táblázata elé „desszertek” értékkel.

<th id="foetelek">Főételek</th>
<th id="desszertek">Desszertek</th>

7. A táblázatokban lévő képek megjelenési szélességeit állítsd egységesen 140 pixel értékűre.

<img src="french-toast.jpg" alt="french-toast"  width="135140">
mindhárom képnél végezd el a módosítást

8. Vond össze a táblázatok fejléc cella sorait a velük szomszédos üres cellákkal.

<th colspan="2">Reggeli</th>
<th></th>
mindh a négy helyen végezd el a módosításokat

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

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

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

Fájl - Megnyitás

Az űrlapon rádiógombokhoz tartozó feliratokat tedd címke (label) típusúvá.

<input type="radio" name="nap" value="ma" id="napma"><label for="napma">mai napra</label>
mindhárom helyen végezd el a módosítást, ügyelj, hogy a for értékhez mindig a megfelelő id érték kerüljön

10. A „Személyek száma” felirathoz tartozó űrlapelemet módosítsd úgy, hogy az elem minden értéke látszódjon. Alapértelmezésben az 1. érték legyen kiválasztott állapotban.

<select name="szemszam" size="6">
	<option value="1" selected>1</option>
	<option value="2" selected>2</option>

11. A nyomógomb név értéke „ok”, a felirata „küldés” legyen.

<input type="submit" name="submitok" value="submitküldés">

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 kozep osztályú elemekre a szövegigazítás középre történjen.

#tartalom .kozep{
	text-align: center;
}

13. A th elemekre határozz meg #060 háttérszínt, valamint #fff betűszínt.

th{
	padding: 5px;
	background-color: #060;
	color: #fff;
}

14. A td elemeknek állítsd a bélés (padding) értékét 5 pixelre, függőleges igazítását pedig alulra.

td{
	border-bottom: 1px dotted #888;
	padding: 5px;
	vertical-align: bottom;
}

15. A form elemeknek állítsd be a margóját a következőképpen: felül és alul a margó 0 méretű legyen, a bal- és jobboldali margót állítsa be úgy, hogy az elem középre rendeződjön.

form{
	...
	margin: 0 auto;
}

16. A legend elemek számára állíts be félkövér betűstílust és 20 pixeles betűméretet.

legend{
	font-size: 1.1em20px;
	font-weight: bold;
}

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: