Meter. Autre nouveauté dans le monde HTML 5, c'est la balise METER. Fini le temps où des mesures traînaient un peu partout dans les pages sans qu'on puisse deviner par le markup la signification de chacun. La nouvelle balise Meter a été introduite pour corriger la sémantique de l'information de la page lorsqu'on veut indiquer une mesure dans une plage connue.
De plus, ça s'affiche joliment.Essentiellement, vous pourrez indiquer que l'espace disque est utilisé à 35% ou que vous avez obtenu un pointage de 7/10 dans votre code HTML (exemple minimaliste) : <meter>35%</meter> <meter>7/10</meter> <meter>35%</meter><meter>7/10</meter> Visuellement, ça ne sert pas à grand chose si on n'établit pas les bornes dans laquelle se fait la mesure. <meter min="0" max="10" value="2">2/10</meter> <meter min="0" max="10" value="5">5/10</meter> <meter min="0" max="10" value="8">8/10</meter> Comment ça fonctionne ? <meter value="0.5">50%</meter> <meter value="0.5">50%</meter> Tags: HTML. Datalist. Avec l'annonce d'HTML5, de grandes nouveautés accompagnent les formulaires.
Ils peuvent enfin s'enrichir afin de s'adapter au plus près des nouveaux besoins. Ainsi l'élément <datalist> fait son entrée. Des suggestions de choix Inauguré avec la vague HTML5, <datalist> est un élément de formulaire permettant de lier une liste de choix à un élément input. Par défaut, <datalist> demeure invisible. Compatibilité navigateur de l'élément <datalist> Un navigateur ne supportant pas l'élément n'affichera aucune suggestion. Utilisation classique Dans la majorité des situations, il sera utile d'associer un champ d'entrée texte <input type="text"> à une liste de suggestions.
<label for="choix_bieres">Indiquez votre bière préférée :</label><input list="bieres" type="text" id="choix_bieres"><datalist id="bieres"><option value="Meteor"><option value="Pils"><option value="Kronenbourg"><option value="Grimbergen"></datalist> Démonstration Aperçu sous Internet Explorer 10 Utilisation multiple Démonstration.
Input. HTML 4 était bien limité concernant les types de champs. HTML5 apporte énormément en terme de nouveautés. Ces innovations sont réunies sous un nom : les Web Forms (ou HTML5 Forms). Souvenez vous des éléments de saisie et de soumission de formulaire en HTML4 assez peu nombreux : <textarea> <select> (<option> et <optgroup>) <button> <input> (text, password, file, radio, checkbox, submit, image, hidden, reset,button) Grâce à l'apport de HTML5 et des Web Forms, de nouveaux éléments et types d'éléments arrivent dans nos formulaires.
Les nouveaux types d'<input> Comme listés précédemment, les types de champs n'étaient pas nombreux. Au moment de mes tests, j'ai constaté que Chrome - qui prenait en charge certains types d'input de type datation dans ses versions précédentes - a revu ses compétences à la baisse dans la version 16.
La plupart des nouveaux types non pris en charge par un navigateur sont traduits par un champ de type text. Les nouveaux éléments de formulaire. Nouveautés. Le HTML5, le successeur du HTML4.01 est arrivé depuis quelques temps déjà. Il offre pas mal de nouveauté intéressante, voici un rapide aperçu du potentiel du HTML 5: Plus d'interactivité L'une des principales nouveautés de HTML 5 : l'interactivité ! Il est très courant sur le Web de rencontrer des sites web qui manipulent des données hautement interactives telles que : des vidéos, des musiques, des animations,... et bien sûr jusqu'à présent toutes ces technologies nécessitaient des langages tiers et indépendant du HTML.
Et bien à partir de maintenant, le langage HTML 5 permet également au webmaster de construire des applications web plus dynamique du côté de l'interface utilisateur sans avoir la nécessité de recourir à d'autres langages : Javascript, Flash, Ajax.... Par exemple des fonctions natives de glisser-déposer... Un code plus propre Un code plus facile à comprendre Une géolocalisation possible Et oui, c'est également l'une des grandes nouveautés du langage HTML 5. Map/Area. Exemple de balise <area> HTML5 Résultat, le navigateur affichera : Rouge = Accueil, Vert = Google Définition et usage La balise <area> définit une zone cliquable dans une image.
La balise <area> est toujours imbriquée dans la balise <map> Les balises <map> et <area> permettent de créer un champ de navigation basé sur une image. Remarque : L’attribut usemap de la balise <img> est associé et identique à l’attibut de la balise <map>.Il crée une relation entre l’élément <map> et l’élément <img> Attribut de la balise <area> Évolution par rapport au HTML 4.01 De nouveaux attributs sont apparus en HTML5 tandis que d’autres ont été bannis (voir la liste ci-dessus).
Attribut standard : La balise <area> prend en charge tous les attributs standard en HTML5. > Liste complète des attributs Attribut d’évènement : La balise <area> prend également en charge tous les attributs d’événement HTML5. > Liste complète des événements Les balises d’image en HTML5.