HTML5 n'a qu'un seul type de document simple ：<!DOCTYPE html> , ce qui signifie que le navigateur l'analysera selon le mode standard.
Vous pouvez désormais utiliser charset dans les balises méta : <meta charset=utf-8″ />
<link rel=stylesheet href=path/to/stylesheet.css /><script src=path/to/script.js></script>De nouvelles balises plus sémantiques
Par exemple : <article>, <section>, <aside>, <hgroup>, <header>,<footer>, <nav>, <time>, <mark>, <figure> et <figcaption>, etc.
Vidéo et audio<video width=640 height=320 preload=auto poster=0.jpg CONTROLS> <source src=movie.ogg type=video/ogg /> <source src=movie.mp4 type=video/mp4 /> Votre navigateur ne prend en charge la balise vidéo.</video>Amélioration du formulaire
Nouveaux types d'entrée : couleur, e-mail, date, mois, semaine, heure, dateheure, dateheure-locale, numéro, plage, recherche, téléphone et URL
Nouvelles propriétés : obligatoire, autofocus, modèle, liste, saisie semi-automatique et espace réservé
Nouveaux éléments : <keygen>, <datalist>, <output>, <meter> et <progress>
La balise canvas dessine des graphiques 2D.
var canvas = document.getElementById('canvas');var contexte = canvas.getContext('2d');context.beginPath();context.moveTo(100,100);context.lineTo(300,300);context.lineTo(100,500) ;context.lineWidth = 5;context.StrokeStyle = rouge;context.Stroke(); Acquisition de localisation géographique Sémantique HTML 1. Qu'est-ce que la sémantique HTML ?Déterminez la sémantique du contenu via des balises, par exemple, déterminez que le contenu est un titre basé sur la balise h1, déterminez que le contenu est un paragraphe basé sur la balise <p>, déterminez que la balise <input> est une zone de saisie, etc.
2. Pourquoi la sémantique ?1). Lorsque le style est supprimé ou perdu, la page peut présenter une structure claire.
2) Pratique à analyser pour d'autres appareils (tels que les lecteurs d'écran, les lecteurs aveugles, les appareils mobiles) pour afficher les pages Web de manière significative.
3) Propice au référencement
4) Il est pratique pour le développement et la maintenance des équipes et suit les normes du W3C pour réduire la différenciation.
3. Comment déterminer si vos balises sont sémantiquement valables ?Supprimez les styles et voyez si la structure de la page Web est bien organisée et offre toujours une bonne lisibilité.
4. Modules de balises sémantiques communesformulaire
<form action= method=> <fieldset style=border: none> <legend style=display: none>Formulaire de connexion</legend> <p><label for=name>Compte :</label><input type=text id =name></p> <p><label for=pw>Mot de passe :</label><input type=password id=pw></p> <input type=submit name=Login class=subBtn> </fieldset></form>
Les champs du formulaire doivent être enveloppés avec des balises materialset, et la balise legend doit être utilisée pour décrire l'objectif du formulaire ; le texte de description correspondant à chaque balise d'entrée doit utiliser la balise label, et la description doit être faite en définissant l'identifiant. attribut pour l’entrée et paramètre for=someld dans la balise label Le texte est associé à l’entrée correspondante.
5. Quelques problèmes auxquels il convient de prêter attention lors de l'utilisation de balises sémantiquesUtilisez le moins de balises non sémantiques div et span que possible ;
Lorsque la sémantique n'est pas évidente, vous pouvez utiliser div ou p. Essayez d'utiliser p, car p a un espacement supérieur et inférieur par défaut, ce qui est bénéfique pour la compatibilité avec les terminaux spéciaux ;
N'utilisez pas de balises de style pur, telles que : b, font, u, etc., utilisez plutôt les paramètres CSS.
Le texte qui doit être souligné peut être inclus dans la balise strong ou em. Le style par défaut de strong est gras (n'utilisez pas b) et em est italique (n'utilisez pas i).
RésumerCe qui précède est la balise sémantique de la nouvelle fonctionnalité HTML5 présentée par l'éditeur. J'espère qu'elle vous sera utile. Si vous avez des questions, veuillez me laisser un message et l'éditeur vous répondra à temps. Je tiens également à remercier tout le monde pour votre soutien au site d'arts martiaux VeVb !