Webszerkesztés
Notepad ++

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

Módosítsd a „Figyelem!” címsor szövegét „Rendelési rend változás!”-ra.

<h2>Figyelem! Rendelési rend változás!</h2>

Szúrj be egy új 2. szintű címsort „Rendelési idő” szöveggel a táblázat elé.

<hr>
<h2>Rendelési idő</h2>
<table>

3. A Július 26-tól augusztus 5-ig szövegrészt tedd dőltté. A 24 órás sürgősségi szövegrészt tedd félkövérré.

<i>Július 26-tól augusztus 5-ig</i>
<b>24 órás sürgősségi</b>

4. Egyesítsd a táblázat fejléc celláit a szomszédos üres cellákkal.

<th colspan="2">Felnőtt betegek részére:</th>
<th></th>
a módosításokat a másik két fejléc cellánál is végezd el!

5. A táblázat „Felnőtt betegek részére” részét (az alatta lévő 5 sorral együtt) helyezd át a tábla végére.

jelöld ki a megadott tartományt egérrel
<tr>
	<th colspan="2">Felnőtt betegek részére:</th>
	....
	<td>8-14 óráig</td>
</tr>
C + c (másolás), lépj át a megfelelő helyre, C + v (beillesztés)

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

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

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

Fájl - Megnyitás

Módosítsd a május, június, július, augusztus sorok alatti felsorolások jelölőit úgy, hogy azok számozatlan felsorolás stílusúak legyenek. (május, június nem felsorolás!!!

<ol><ul>
...
<ol><ul>
bár a május, június helytelenül van a példában, ott is igazítsátok ki felsorolásra a szükséges részeket

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

<html lang="hu">
<head>
...
<title>Med-Im Bt.
</head>
<body>
...
</body>	
</html>

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

Fájl - Megnyitás

Állíts be hiperhivatkozást az „írjon címünkre” szövegrészre, amely mutasson a hirlevel@medim.hu email címre úgy, hogy a levél tárgya „feliratkozás” legyen.

<a href="mailto:hirlevel@medim.hu?subject=feliratkozás">írjon címünkre</a>

Állíts be hiperhivatkozást az „ugyanígy teheti” szövegrészre is, amely ugyanerre az email címre mutasson, de a levél tárgya „leiratkozás” legyen.

<a href="mailto:hirlevel@medim.hu?subject=leiratkozás">ugyanígy teheti</a>

9. Javítsd a címsor melletti kép paramétereit a következőképpen: a kép fájlneve envelope.jpg, a megjelenő kép szélessége 150 pixel legyen. Adj alternatív szöveget a képnek Boríték értékkel.

<img src="xyz.jpg" "envelope.jpg" width="150" alt="Boríték">

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

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

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

Fájl - Megnyitás

Módosítsd a többsoros beviteli mező tulajdonságait úgy, hogy a sorok száma 4, a soron belüli karakterek száma 40 legyen.

<textarea name="megjegyzes" cols="40" rows="4">

11. Szúrj be egy reset típusú gombot a küldés gomb mellé. A gomb felirata „adatok törlése” legyen.

<input type="reset" value="adatok törlése">

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 menusor azonosítójú elemre vonatkozó háttérszín legyen #ff9c00.

#menusor{
	background-color: yellow #ff9c00;
}

Módosítsd az aktiv azonosítójú elemre vonatkozó háttérszínt fehérre (white).

#aktiv{
	background-color: lightgray white;
}

13. Módosítsd a table, th, td elemekre vonatkozó keret tulajdonságait: a keret legyen folytonos vonalú, 1 pixel vastag és #666 színű.

table, th, td{
	border: 0 1px solid #666;
}

14. A táblázat alsó és felső margói legyenek 20 pixel szélesek, a bal- és jobboldali margót pedig állítsd be úgy, hogy a táblázat középre rendeződjön.

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

15. A submit és a reset típusú gombok szélessége legyen 120 pixel, magassága pedig 30 pixel.

.mezosor .mezo input[type='submit'],
.mezosor .mezo input[type='reset']{
	margin: 10px;
	width: 120px;
	height: 30px;
}

16. Azon elemek háttérszíne, amelyek osztálya mezosor és z1, legyen #fef6e7. Azon elemek háttérszíne pedig, amelyek osztálya mezosor és z2, legyen #fffbf4.

.mezosor.z1 {
	background-color:#fef6e7;
}
.mezosor.z2 {
	background-color:#fffbf4;
}

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: