Maison >interface Web >tutoriel HTML >Quelles sont les différences entre le HTML5 et le HTML traditionnel ? Quels sont les éléments nouveaux et supprimés ?
Quelles sont les différences entre le HTML5 et le HTML traditionnel ? Quels sont les éléments nouveaux et supprimés ?
- yuliaoriginal
- 2018-09-17 17:58:312114parcourir
Cet article se concentre sur le HTML. Il parle principalement des différences entre HTML5 et HTML traditionnel, ainsi que de certains éléments nouveaux et abolis du HTML5. Les amis dans le besoin peuvent s'y référer.
1. Modifications de la syntaxe HTML5
Les modifications mentionnées dans ce point de connaissance font référence aux modifications définies sur la base de HTML4, principalement comme suit :
1. L'extension de fichier (.html ou .htm) et le type de contenu (text/html) de HTML5 restent inchangés.
2. En HTML5, les déclarations de version ne sont délibérément pas utilisées. Un document s'appliquera à toutes les versions de HTML.
3. À partir de HTML5, il est recommandé d'utiliser UTF-8 pour l'encodage des caractères des fichiers.
4. HTML5 garantit une compatibilité maximale avec les versions HTML précédentes.
Afin d'assurer la compatibilité, nous devons commencer par l'élément. En HTML5., la balise de l'élément peut être omise. Plus précisément, les balises des éléments sont divisées en trois types : "la balise de fin ne peut pas être écrite", "la balise de fin peut être omise" et "la balise de début et la balise de fin peuvent être omises".
Les éléments de la balise de fin ne peuvent pas être écrits : zone, base, br, col....
La balise de fin peut être omise : li, dt, dd, p, rt...
Toutes les balises de début et de fin peuvent être omises : html, head, body...
2. Nouveaux éléments structurels
article représente un élément de contenu indépendant dans la page qui n'est pas lié au contexte, tel que comme dans un blog. Un article ou un article dans un journal ; l'élément
aside représente des informations auxiliaires liées au contenu de l'élément article en plus du contenu de l'élément article ; l'élément
header représente un contenu ; bloc ou la page entière dans la page Le titre ; l'élément
hgroup est utilisé pour combiner le titre de la page entière ou un bloc de contenu dans la page ; l'élément
footer représente la note de bas de page de la page entière ou un bloc de contenu ; bloc de contenu dans la page. De manière générale, il contiendra le nom du créateur, la date de création et les coordonnées du créateur ; l'élément
nav représente la partie lien de navigation de la page ; l'élément
figure représente un contenu de flux indépendant, représentant généralement le flux principal du document. Une unité indépendante dans le contenu, utilisez l'élément figcaption pour ajouter un titre au groupe d'éléments figure
embed est utilisé pour insérer divers multimédias, le format peut être Midi, Wav, AU, MP3, etc. ; l'élément
mark est utilisé pour présenter visuellement à l'utilisateur le texte qui doit être mis en évidence ou mis en surbrillance. Une application typique consiste à mettre en évidence les mots-clés de recherche pour les utilisateurs dans les résultats de recherche
l'élément de progression représente un processus en cours
l'élément ruby représente les commentaires ruby (chinois); phonétique ou caractères)
L'élément rt représente des caractères (explication ou prononciation chinoise (pinyin ou caractère)
L'élément rp est utilisé dans les commentaires Ruby pour définir ce qui est affiché par les navigateurs qui ne prennent pas en charge les éléments Ruby.
L'élément wbr représente un retour à la ligne doux, et lorsque la largeur n'est pas suffisante, il s'enroulera activement ici
L'élément canvas représente des graphiques, tels que des graphiques et d'autres images
L'élément cammand représente des boutons de commande. , tels que les boutons radio et les cases à cocher. L'élément box ou bouton
details représente les informations détaillées dont l'utilisateur a besoin et peut obtenir
l'élément datagrid représente une liste de données facultatives, qui est affichée sous la forme d'un tree list
l'élément keygen représente la clé générée
L'élément de sortie représente différents types de sortie, tels que la sortie d'un script
L'élément source définit les ressources multimédias pour les éléments multimédias (tels que
le type d'url représente la zone de saisie de texte dans laquelle l'adresse URL doit être saisie
le type de numéro représente une zone de saisie de texte dans laquelle une valeur numérique doit être saisie
la plage Type représente une zone de saisie de texte dans laquelle un la valeur numérique doit être saisie dans une certaine plage
date - sélectionnez le jour, le mois, l'année
mois - sélectionnez le mois, l'année
week - sélectionnez la semaine et l'année
heure - sélectionnez l'heure (heures et minutes)
datetime — —Sélectionnez l'heure, le jour, le mois, l'année (heure UTC)
datetime.local —Sélectionnez l'heure, le jour, le mois , année (heure locale)
3. Détruire les éléments
Pour les éléments tels que. basefont, big, center, font, s, strike, tt, u, car leurs fonctions sont pures Accédez au service d'affichage d'écran, et HTML5 préconise de mettre la fonction d'affichage d'écran dans la feuille de style CSS pour une édition unifiée, donc ces éléments sont abolis
Pour l'élément frameset, les éléments frame et les éléments noframes Étant donné que les frames ont un impact négatif sur la convivialité des pages Web, les frames ne sont plus pris en charge en HTML5. Seules les iframes sont prises en charge, ou sous la forme d'une page composite composée de plusieurs pages créées par le serveur. En même temps, les trois éléments ci-dessus sont supprimés.
Pour les éléments tels que l'applet, le bgsound, le clignotement et le marquee, étant donné que seuls certains navigateurs prennent en charge ces éléments, notamment l'élément bgsound et l'élément marquee, qui ne sont pris en charge que par Internet Explorer, ils ont été supprimés dans HTML 5. L'élément applet peut être remplacé par l'élément ernedd ou l'élément object, l'élément bgsound peut être remplacé par l'élément audio et le chapiteau peut être remplacé par une programmation JavaScript
4. Autres éléments obsolètes :
Détruisez l'élément rb et utilisez le remplacement de l'élément ruby
supprime l'élément acronyme, utilise l'élément abbr pour remplacer
pour supprimer l'élément dir, utilise l'élément ul pour remplacer
supprime l'élément isindex, utilise l'élément form combiné avec l'élément input pour remplacez
pour supprimer l'élément de liste, utilisez Utilisez l'élément pre pour remplacer
pour déprécier l'élément xmp, utilisez l'élément code pour remplacer
pour déprécier l'élément nextid, utilisez GUIDS pour remplacer
pour déprécier le élément de texte en clair, utilisez le type MIME "text/plian" pour remplacer
quatre .Nouveaux attributs et attributs abolis
Nouveaux attributs
1. attributs associés
Nouvel attribut de mise au point automatique, qui permet à l'élément de gagner automatiquement le focus lorsque l'écran s'ouvre ;
Ajoutez un attribut d'espace réservé, qui invitera l'utilisateur à saisir et lui demandera ce qu'il peut saisir ;
Ajoutez un attribut de formulaire, déclarez à quel formulaire il appartient, puis placez-le n'importe où sur la page, pas dans le formulaire
Ajout de l'attribut obligatoire, qui indique qu'il sera vérifié lorsque l'utilisateur soumettra, et il doit y avoir du contenu d'entrée dans l'élément ;
.....
2. Attributs liés au lien
Ajoutez l'attribut media, qui spécifie le type de média/appareil pour lequel l'URL cible est optimisée. , et ne peut être utilisé que lorsque l'attribut href existe ;
Ajoutez l'attribut hreflang et l'attribut rel à Rester cohérent avec l'élément a et l'élément link
...
3. révérend, qui spécifie la liste à afficher dans l'ordre inverse ;
ajoute l'attribut async à l'élément de script, qui définit si le script est exécuté de manière asynchrone
......
Les attributs redondants, tels que : cible, profil, version, etc. un nouveau concept d'"attributs globaux" a été ajouté. Les attributs dits globaux font référence à des attributs qui peuvent être utilisés sur n'importe quel élément
Cet attribut permet aux utilisateurs de modifier. Le contenu de l'élément peut obtenir le focus de la souris. L'attribut est une valeur booléenne et peut être spécifié comme vrai ou faux. De plus, cet attribut a également un état d'héritage masqué. Lorsqu'il est vrai, la modification est autorisée. , la modification n'est pas autorisée. Lorsqu'elle est spécifiée, elle est déterminée par héritage. 2. Attribut designMode Cet attribut est utilisé pour déterminer si la page entière est modifiable. Il existe deux attributs « on » et « off ». Lorsque l'attribut est « activé », il peut être modifié ; lorsqu'il est « désactivé », il ne peut pas être modifié.
3. Attribut cachéTous les éléments sont autorisés à utiliser un attribut caché, qui est similaire à l'élément caché dans l'élément d'entrée. Sa fonction est d'avertir le navigateur de ne pas afficher l'élément et de le rendre invisible. La valeur de l'attribut est une valeur booléenne. Lorsqu'elle est vraie, elle est invisible ; lorsqu'elle est fausse, elle est visible.
4. Attribut de vérification orthographique