Webszerkesztés
Notepad ++

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

„A legtöbb viccet beküldők...” kezdetű bekezdés elé szúrj be sortörést, és vond össze a fölötte lévő bekezdéssel.

jobbakat! :P</p><br>
<p>A legtöbb viccet

Alkalmazz félkövér és dőlt betűstílust a Balu szóra.

<b><i>Balu</i></b>

3. Állíts be hiperhivatkozást „az eddig beküldött viccek” szövegrészre, amely mutasson a Viccek című oldalra.

<a href="viccek.html">az eddig beküldött viccek</a>

Állíts be hiperhivatkozást „a küldj jobbakat” szövegrészre is, ez mutasson a bekuldes.html oldalra.

<a href="bekuldes.html">küldj jobbakat</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 top.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 „Balu vicces oldala” szöveggel.

<title>Balu vicces oldala</title>
</head>
<body>
...
</body>
</html>

5. Módosítsd a fun_1.jpg képet magába foglaló bekezdés osztályát kep-re. A képnek adj alternatív szöveget „süti” értékkel.

<p class="kep"><img src="fun_1.jpg" alt="süti">

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

Fájl - Megnyitás

Az oldalon található táblázatnak adj táblázatcímet (caption) „E heti vicceink” szöveggel.

<caption>E heti vicceink</caption>
<tbody>

7. A táblázat minden viccet tartalmazó celláját vond össze a mellette lévő üres cellával.

<td colspan="2">
	- Megjött a tél, uram!<br>
	- Hogyan történhetett ez, Jean, hiszen mára nem is vártunk vendégeket. 
</td>
<td></td>
a fenti módosításokat minden viccet tartalmazó cella esetén végezd el

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

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

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

Fájl - Megnyitás

Az űrlap Név feliratához tartozó beviteli mező név értéke legyen „nev”, a maximálisan beírható karakterek száma pedig 40.

<input type="text" name="textnev" maxlength="40">

9. A többsoros beviteli mező paramétereit módosítsd úgy, hogy a sorok száma 8, a soron belüli karakterek száma 55 legyen, alapértelmezetten a mezőben „A kedvenc viccem:” szöveg látszódjon.

<textarea name="vicc" rows="8" cols="55">A kedvenc viccem:</textarea>

10. Az jelölőnégyzet alapértelmezetten legyen bejelölt állapotban, a mellette lévő szöveget alakítsd a jelölőnégyzet címkéjévé (label).

<input type="checkbox" name="vicclevel" value="'1" id="vicclevel" checked>
<label for="vicclevel"> Igen, napra friss vicceket kérek!</label>

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

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

Mentsd el és zárd be a bekuldes.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 valasztek azonosítójú elemen belüli hivatkozás jelölő elemek hover állapota esetén a betűszín legyen #f99.

#valasztek a:hover{
	color: #f99;
}

13. A viccek osztályú elemeken belüli th elemekre határozz meg dőlt betűtípust és balra történő szövegelrendezést.

.viccek th{
...
	font-style: italic;
	text-align: left;
}

14. A top osztályú table elemek számára állíts be 1 pixel vastag, pontozott mintázatú és fekete (black) színű keretet.

table.top{
	border: 1px dotted black;
}

15. A fieldset elemek szélességére adj 650 pixel értéket.

fieldset{
	width: 650px;
}

16. A legend elemekhez rendelj félkövér betűstílust.

legend{
	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: