Elérkeztünk ahhoz a fontos részhez amikor is megtanulunk listát készíteni és megjeleníteni a már szépen designolt weboldalunkon egy Listát.
==============
Lista beillesztése:
==============
Definiálása:
<ul>
<li>Tej</li>
<li>Kenyér</li>
<li>Hertz szalámi</li>
</ul>
Az <ul> tag-el jelezzük, hogy itt most bizony egy lista fog következni és a listaelemeket pedig a <li> tag-ek közé helyezzük.
Íme:
- Tej
- Kenyér
- Hertz szalámi
Van lehetőség változtatni a felsorolás szimbólumán is például ha számokkal szeretnénk akkor:
<ol>
<li>Tej</li>
<li>Kenyér</li>
<li>Hertz szalámi</li>
</ol>
Az eredmény:
- Tej
- Kenyér
- Hertz szalámi
Ha mindez nem elég, akkor definiálhatunk saját listát is:
<dl>
<dt>Tej</dt>
<dd>Mizo</dd>
<dt>Kávé</dt>
<dd>Karaván</dd>
</dl>
Saját kis listánk :->
- Tej
- Mizo
- Kávé
- Karaván
==================
Űrlapok beillesztése:
==================
Fontos szerepe van az űrlapoknak abban, hogy interaktívabbá tegyük az oldalunkat és dinamikus tartalmakat készíthessünk. Ezek segítségével küldhet a felhasználó adatokat, melyeket aztán szerver oldalon fel tudunk dolgozni többféleképpen, például PHP segítségével. Nézzünk egy egyszerű és gyakori példát, ahol bekérjük a látogatótól a felhasználónevét és jelszavát. ( hogy ellenőrizzük regisztrált-e már Nálunk. )
Definiálása:
<form>
Felhasználónév:
<input type=”text” name=”username” />
<br />
Jelszó:
<input type=”text” name=”password” />
</form>
És ahogy megjelenik:
A <form> tagek közé zárjuk az ‘input boxokat’.
Megadhatjuk a típusát is az input boxoknak és ezek határozzák meg a fő megjelenési formát.
A ‘name’ tulajdonság a későbbiekben lesz fontos, mivel ezekkel hivatkozunk az egyes ‘input boxokra’ amikor lekezeljük szerver oldalon a kapott adatokat.
Más típusok:
- Rádió gombok
<form>
<input type=”radio” name=”neme” value=”férfi” /> Férfi
<br />
<input type=”radio” name=”neme” value=”nő” /> Nő
</form>
Itt azt a fő különbséget kell észrevenni – mert még a vak is látja – , hogy megjelent egy ‘value’ attributum, amivel rögzítettük az értékeket, így csak ki kell választania a kedves látogatónak a megfelelő gombocskát és a hozzá tartozó érték már meg is van.
- Jelölő négyzet
<form>
<input type=”checkbox” name=”neme” value=”férfi” /> Férfi
<br />
<input type=”checkbox” name=”neme” value=”nő” /> Nő
</form>
->