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.
-
„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.
-
-
-
4. Nyisd meg a top.txt fájlt.
-
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ájltípus: (*.html)
-
-
6. Nyisd meg a viccek.html fájlt.
-
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>
Mentsd el és zárd be a viccek.html fájlt.
-
-
-
8. Nyisd meg a bekuldes.html fájlt.
-
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.
-
-
-
12. Nyisd meg a styles.css fájlt.
-
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.
-
-
-
-
-
Az elkészült weboldal:

