- statikusak
- dinamikusak
A dinamikus weboldalak lényegi eleme egy olyan eszköz, melynek segítségével a weboldal tartalmát akár a megjelenés előtt, vagy ezzel egyidőben megváltoztathatjuk.
Ilyen például egy hírportál, ahol a hírek frissítéséhez nincs szükségünk a forráskód manuális változtatására, vagy ilyen lehet például egy pizzafutár cég rendelési oldala, ahol a felhasználó megadhatja a rendelését.
A legtöbb esetben ez az "eszköz" egy programozási nyelv (php, javascript, phyton, stb...), illetve a vele párhuzamosan, a háttérben működő adatbázis.
A dinamikus weboldalak lényeges részei lehetnek az űrlapokon elhelyezett különféle beviteli mezők.
Ebben a témakörben ezeknek az elkészítésével foglalkozunk.
FONTOS! Mi csak az elemek a létrehozásával foglalkozunk, a háttérprogramozásával már nem!
Fontosabb űrlap elemek:
- Egysoros beviteli mező
- Hosszabb szöveg bevitelére alkalmas mező
- Jelszó
- Jelölő négyzet
- Választó kapcsoló (radio gomb)
- Általános gomb
- Elküldés gomb
- Dátum definiálása
- Szín kiválasztása
| Elem neve | Megjelenése | HTML kódja | Megjegyzés |
| Egysoros szövegbeviteli mező | <input type="text"> | ||
| Hosszabb szöveg bevitelére alkalmas mező | <input type="text"> | ||
| Jelszó mező | <input type="password"> | ||
| jelölő négyzet | alma szilva |
<input type="checkbox" name="gyumolcs"> | Többet is kiválaszthatsz ugyanabból a csoportból! |
| választó kapcsoló | alma szilva |
<input type="checkbox" name="gyumolcs"> | Csak egyet választhatsz ugyanabból a csoportból! |
| általános gomb | <input type="button" value="Nyomj meg!"> | ||
| általános gomb | <input type="submit" value="Elküldés"> | A beírt adatokat továbbküldi feldolgozásra. | |
| dátum kiválasztó mező | <input type="date"> | ||
| szín kiválasztása | <input type="color"> | Mutatja a kiválasztott szín rgb kódját is. |
Mintafeladat
Készítsük el közösen az alábbi kapcsolatfelvételi űrlapot tartalmazó weboldalt!
Minta:
|
|
|
|
- Készíts egy kapcsolatfelvételi űrlapot tartalmazó weboldalt Feltöltés alatt...