Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
Télécharger au format pdf ou txt
Vous êtes sur la page 1/ 4
COMMUNICATION ET TECHNOLOGIE INTERNET HTML5/CSS3
La balise form déclare une zone de formulaire dans laquelle il sera possible pour les utilisateurs de saisir des informations qui pourront par la suite être récupérées côté serveur. Il est possible d'utiliser plusieurs formulaires dans une même page à condition de ne pas les imbriquer. Enfin il est important de donner une valeur à l'attribut name du formulaire pour y faire référence. Les structures utilisées à l'intérieur d'un formulaire sont les éléments : Input. textarea (zone de texte). select (liste de choix). button (bouton). La balise input fait partie des éléments composant un formulaire (avec les tags button, select et textarea) et permettant donc d'interagir avec l'utilisateur. Les saisies possibles et le comportement de la balise input dépend fortement de la valeur indiquée dans son attribut type. Voilà une liste de quelques attributs spécifiques :
p. 1 Classe : 2TI1 COMMUNICATION ET TECHNOLOGIE INTERNET HTML5/CSS3
Annexe 5 :
p. 2 Classe : 2TI1 COMMUNICATION ET TECHNOLOGIE INTERNET HTML5/CSS3
Activité 5 : S’INSCRIRE est un lien qui ouvre une page formulaire pour s’inscrire au lycée (voir Annexe 5) <!doctype html> <head> <title>INSCRIPTION El Emtyèse</title> <meta charset="utf-8"/> <meta name="keywords" content="Lycée, Emtyèse"/> <meta name="description" content="Site d'inscription au lycée emtyèse sidi hsin"/> <meta name="author" content="Imen Arfaoui"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <link rel="icon" href="façade.jpg"/> <link rel="stylesheet" type="text/css" href="teststyle.css"/> </head> <body> <a name="haut"></a> <div> <audio controls="controls" preload="auto" autoplay="autoplay" loop="loop"> <source src ="Bithoven.mp3"> </audio> <h1>Lycée <br/> El Emtyèse <br/> Sidi Hsin</h1> <hr/> </div> <a href="#bas"> <img src="bas.jpg"/> </a> <form> <!--Formulaire--> <!—fieldset : Groupement 1 : division et regroupement des parties d’un formulation--> <fieldset> <legend>Informations personnelles</legend> <!—legend : nom du groupement--> <p> Sexe: <!—span : division du texte ; input :entrée par l’utilisateur ; type=radio bouton radio ; checked : coché--> <span> <input type=radio name=cv checked>Masculin <input type=radio name=cv checked>Feminin </span> </p> <p> Nom: <input type=text> Prénom: <input type=text> </p> <!— input :entrée par l’utilisateur ; type texte> <!— input :entrée par l’utilisateur ; type date ; value : valeur par défaut> <p> Date de naissance: <input type=date value="jj/mm/aaaa"> Lieu de naissance: <input type=text> </p> <p> Adresse Email : <input type="email"> </p> <!— input :entrée par l’utilisateur ; type adresse email > <!— textarea : zone de saisie définie par des lignes : rows et des colonnes :cols > <p>Adresse:</p> <textarea rows="5" cols="50"></textarea> </fieldset> <fieldset> <legend>Informations supplémentaires</legend> <!— select : liste à choix sélectionnée par l’utilisateur> <p> Classe: <select> <option>1ère année</option> <option>2ème année</option> <option>3ème année</option> <option>4ème année</option> </select> <select> <option>S1</option> <option>S2</option> <option>S3</option> <option>S4</option> <option>S5</option> <option>S6</option> <option>S7</option> <option>S8</option> <option>informatique 1</option> <option>informatique 2</option> <option>science 1</option> <option>science 2</option> <option>science 3</option> <option>eco 1</option> <option>eco 2</option> <option>eco 3</option> <option>math</option> </select> </p> <p> Option: <!— checkbox : case à cocher par l’utilisateur> <span> <input type=checkbox name=op >Italien <input type=checkbox name=op >Dessin </span> </p> <!— file : fichier à charger par l’utilisateur> <p> Votre photo jpg, png, bmp...: <br/> <input type="file" > </p> </fieldset> <!— submit : bouton de validation de l’inscription par l’utilisateur ; onclick=alert(" ") : message si on clique>
