VSC + HTML + CSS
Formuláře
Formuláře jsou důležitou součástí webových stránek, které umožňují uživatelům zadávat informace a odesílat je na server.
Pro formulář máme několik typů prvků, jako jsou textová pole, tlačítka a seznamy.
Základní tagem je <form> což je párový tag
<form action="odeslani.php" method="post">
<label for="jmeno">Jméno:</label>
<input type="text" id="jmeno" name="jmeno">
<input type="submit" value="Odeslat">
</form>
V tomto příkladu máme formulář, který odesílá data na server pomocí metody POST. Obsahuje textové pole pro jméno a tlačítko pro odeslání formuláře.
Další běžné typy vstupních polí zahrnují:
- <input type="email"> - pro zadání e-mailové adresy
- <input type="password"> - pro zadání hesla
- <textarea> - pro víceřádkový textový vstup
- <select> - pro výběr z rozbalovacího seznamu
- <input type="checkbox"> - pro zaškrtávací políčka
- <input type="radio"> - pro výběr jedné možnosti z několika
Formuláře mohou také obsahovat tlačítka pro resetování formuláře nebo další akce.
<input type="reset" value="Resetovat">
<button type="button" onclick="alert('Tlačítko bylo kliknuto!')">Klikni mě</button>
CodePen
Ukázka formuláře s různými typy vstupních polí
Kontaktní formulář
CodePen
Trochu si formulář nastylujeme.
Kontaktní formulářHTML kousky
width:calc()
Menu
Barvy u zátržítek a boxů
Accordion
Hodiny
Single page
Pricing card
Fluid Layout with Flex
Formuláře
Formuláře jsou důležitou součástí webových stránek, které umožňují uživatelům zadávat informace a odesílat je na server.
Pro formulář máme několik typů prvků, jako jsou textová pole, tlačítka a seznamy.
Základní tagem je <form> což je párový tag
<form action="odeslani.php" method="post">
<label for="jmeno">Jméno:</label>
<input type="text" id="jmeno" name="jmeno">
<input type="submit" value="Odeslat">
</form>
V tomto příkladu máme formulář, který odesílá data na server pomocí metody POST. Obsahuje textové pole pro jméno a tlačítko pro odeslání formuláře.
Další běžné typy vstupních polí zahrnují:
- <input type="email"> - pro zadání e-mailové adresy
- <input type="password"> - pro zadání hesla
- <textarea> - pro víceřádkový textový vstup
- <select> - pro výběr z rozbalovacího seznamu
- <input type="checkbox"> - pro zaškrtávací políčka
- <input type="radio"> - pro výběr jedné možnosti z několika
Formuláře mohou také obsahovat tlačítka pro resetování formuláře nebo další akce.
<input type="reset" value="Resetovat">
<button type="button" onclick="alert('Tlačítko bylo kliknuto!')">Klikni mě</button>
CodePen
Ukázka formuláře s různými typy vstupních polí
Kontaktní formulář
CodePen
Trochu si formulář nastylujeme.
Kontaktní formulář