Exemple de formulaire en HTML

De Wiki Amis SH
Aller à la navigation Aller à la recherche



Le wiki : Accueil - Administrateur - Bureautique - Développeur - Intégrateur - Marketing - Multimédia - Objets numériques - Jeux - We make Hack


Exemple de formulaire en HTML

Tous les objets de formulaire en HTML 5

Source : https://www.scriptol.fr/html5/formulaire.php

Taille input et textarea

<html>
<head>

<style>
body {
    padding: 100px;
    background-color: #efefef;
}
input {
    width: 80%;
    margin: 0;
}
textarea {
    width: 80%;
    height: 100px;
    margin: 0;
}
</style>

</head>
<body>
<input type="text" value="input" />

<textarea cols="" rows="">textarea</textarea>
</body>
</html>

Personnalisation d'un formulaire XHTML avec CSS

Source : https://a-pellegrini.developpez.com/tutoriels/css/formulaire/

Largeur ok pour mobile et prise en compte du zoom utilisateur

Source : https://dmouronval.developpez.com/tutoriels/html/formulaires-html5/

Exemple de modélisation des données avec un formulaire HTML

Le formulaire suivant n'est pas formaté avec les CSS.
Il n'utilise pas les balises HTML5.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Vidéothèque / Ajout de film</title>

</head>

<body>

Ajout d'un film

<form action="traitement_ajout_film.php" method="POST">

Titre <input name="titre" type="text" width="300" maxlength="50" />
Titre Original <input name="titreo" type="text" width="300" />
Date <select name="jour" id="jour">

<option value="01">01</option> <option value="02">02</option> <option value="03">03</option> <option value="04">04</option> <option value="05">05</option> <option value="06">06</option> <option value="07">07</option> <option value="08">08</option> <option value="09">09</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> <select name="mois" id="mois"> <option value="01">01</option> <option value="02">02</option> <option value="03">03</option> <option value="04">04</option> <option value="05">05</option> <option value="06">06</option> <option value="07">07</option> <option value="08">08</option> <option value="09">09</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> </select> <select name="annee" id="annee"> <option value="2007">2007</option> <option value="2006">2006</option> <option value="2005">2005</option> <option value="2004">2004</option> <option value="2003">2003</option> <option value="2002">2002</option> <option value="2001">2001</option> <option value="2000">2000</option> <option value="1999">1999</option> <option value="1998">1998</option> <option value="1997">1997</option> <option value="1996">1996</option> <option value="1995">1995</option> <option value="1994">1994</option> <option value="1993">1993</option> <option value="1992">1992</option> <option value="1991">1991</option> <option value="1990">1990</option> <option value="1989">1989</option> <option value="1988">1988</option> <option value="1987">1987</option> <option value="1986">1986</option> <option value="1985">1985</option> <option value="1984">1984</option> <option value="1983">1983</option> <option value="1982">1982</option> <option value="1981">1981</option> <option value="1980">1980</option> <option value="1982">1982</option> <option value="1981">1981</option> <option value="1980">1980</option> <option value="1979">1979</option> <option value="1978">1978</option> <option value="1977">1977</option> <option value="1976">1976</option> <option value="1975">1975</option> <option value="1974">1974</option> <option value="1973">1973</option> <option value="1972">1972</option> <option value="1971">1971</option> <option value="1970">1970</option> <option value="1969">1969</option> <option value="1968">1968</option> <option value="1967">1967</option> <option value="1966">1966</option> <option value="1965">1965</option> <option value="1964">1964</option> <option value="1963">1963</option> <option value="1962">1962</option> <option value="1961">1961</option> <option value="1960">1960</option> <option value="1959">1959</option> <option value="1958">1958</option> <option value="1957">1957</option> <option value="1956">1956</option> <option value="1955">1955</option> <option value="1954">1954</option> <option value="1953">1953</option> <option value="1952">1952</option> <option value="1951">1951</option> <option value="1950">1950</option> <option value="1949">1949</option> <option value="1948">1948</option> <option value="1947">1947</option> <option value="1946">1946</option> <option value="1945">1945</option> <option value="1944">1944</option> <option value="1943">1943</option> <option value="1942">1942</option> <option value="1941">1941</option> <option value="1940">1940</option> <option value="1939">1939</option> <option value="1938">1938</option> <option value="1937">1937</option> <option value="1936">1936</option> <option value="1935">1935</option> <option value="1934">1934</option> <option value="1933">1933</option> <option value="1932">1932</option> <option value="1931">1931</option> <option value="1930">1930</option> <option value="1929">1929</option> <option value="1928">1928</option> <option value="1927">1927</option> <option value="1926">1926</option> <option value="1925">1925</option> <option value="1924">1924</option> <option value="1923">1923</option> <option value="1922">1922</option> <option value="1921">1921</option> <option value="1920">1920</option> <option value="1919">1919</option> <option value="1918">1918</option> <option value="1917">1917</option> <option value="1916">1916</option> <option value="1915">1915</option> <option value="1914">1914</option> <option value="1913">1913</option> <option value="1912">1912</option> <option value="1911">1911</option> <option value="1910">1910</option> <option value="1909">1909</option> <option value="1908">1908</option> <option value="1907">1907</option> <option value="1906">1906</option> <option value="1905">1905</option> <option value="1904">1904</option> <option value="1903">1903</option> <option value="1902">1902</option> <option value="1901">1901</option> <option value="1900">1900</option>

</select> JJ/MM/AAAA
Durée <label>

<input name="heure" type="text" id="heure" value="0" size="3" maxlength="1" />

<input name="minute" type="text" id="minute" value="00" size="4" maxlength="2" />

HH:MM</label>
Réalisateur <input name="real" type="text" width="300" />
Acteurs <input name="act" type="text" width="300" />
Pays <input name="pays" type="text" width="300" />
Genre <input name="genre" type="text" width="300" />
Support <select name="support" >

<option value="DVD">DVD</option> <option value="VHS">Cassette VHS</option> <option value="film35">Film 35 mm</option>

</select>
Résumé <textarea name="resum" cols="50" rows="10" ></textarea>
<input type="submit" name="Submit" value="Envoyer" />

</form>

<a href="menu.php">Retour au menu</a>

</body> </html>

Récupérer des informations avec input hidden

<input type="hidden" name="accessid" value="<?echo $accessid ?>">
<input type="hidden" name="pays" value="<?echo $pays ?>">
<input type="hidden" name="ville" value="<?echo $ville ?>">
<input type="hidden" name="postal" value="<?echo $postal ?>">

<input type="submit" value="Valider votre référencement !" name="submit">

NAVIGATION

PARTICIPER ET PARTAGER

Bienvenue sur le wiki de Amis SH.
De nombreuses pages sont partagées sur ce wiki.
Créer un compte utilisateur pour participer sur le wiki.
Les pages présentées sur le wiki évoluent tous les jours.
Certaines recherches sont peu abouties et incluent des erreurs.
Utiliser la recherche interne du wiki pour trouver votre contenu.
La page de discussion de Amis SH vous permet de poser vos questions.
Consulter le site amis-sh.fr pour installer votre propre serveur web.
Améliorer le contenu des pages avec vos retours depuis l'onglet discussion.
Ce contenu ne doit pas servir à nuire à autrui ou à un système informatique.
Protéger votre système Linux ou Windows avec cette page dédiée à la sécurité.

SOUTENIR CE WIKI

Soutenir le wiki avec un don en monnaie numérique :
AEON - Bitcoins - Bitcoins Cash - Bitcoins Gold - Bitcore - Blackcoins - Basic Attention Token - Bytecoins - Clams - Dash - Monero - Dogecoins - Ğ1 - Ethereum - Ethereum Classique - Litecoins - Potcoins - Solarcoins - Zcash

OBTENIR DE LA MONNAIE NUMERIQUE

Obtenir gratuitement de la monnaie numérique :
Miner de la cryptomonnaie.
Récupérée de « https://wiki.amis-sh.fr/index.php?title=Exemple_de_formulaire_en_HTML&oldid=245 »