Explication détaillée des balises sémantiques HTML5 et du traitement de compatibilité

L'en-tête

est principalement utilisé pour introduire des informations en tête de page, et peut également être utilisé pour l'en-tête de section

Le titre combine un titre et un sous-titre, ou une combinaison de slogans

Miaowei Classroom

Vous initier à une formation informatique humaine

Navigation (une liste contenant des liens)

< ;nav>

LienLien

Merveilleuse salle de classe

Magnifique salle de classe

< nav>

< ;h2>Merveilleux cours Premium

• javascript
• html+css

< /ul>

< ;footer>Le bas de la page de pied de page ou le bas de la section

, ou en divisant différentes sections dans l'article

sont utilisés pour représenter un ensemble de parties de contenu structurellement complètes et indépendantes sur la page, qui peuvent être utilisées pour présenter un message de forum. . Un article dans un magazine ou un journal, un blog, un contenu de commentaire soumis par l'utilisateur, des widgets de module de page interactif, etc.

les balises d'élément peuvent contenir des références, des barres latérales, des publicités, des groupes d'éléments de navigation et d'autres parties similaires qui sont différentes du contenu principal lié à la page actuelle ou au contenu principal. de côté doit être lié au contenu de l’article. Informations auxiliaires incluses dans

comme contenu principal, dont le contenu est utilisé en dehors de

sous forme de citations, de listes de mots, etc. liées à l'article en cours, comme informations auxiliaires globalement pour la page ou site ; La forme la plus typique est la barre latérale, dont le contenu peut être des liens amicaux, une navigation affiliée ou des unités publicitaires.

figure < Généralement utilisé pour les images ou les vidéos

Le sous-élément de figure est utilisé pour décrire le contenu de la figure

< img src="miaov.png"/>(notez qu'il n'y a pas d'alt)

Photo de la classe Miaowei

est utilisé pour exprimer l'heure ou la date

Nous ouvrons à 9h00

Paramètres

J'ai un rendez-vous le Saint Valentin.

Liste d'options.

est utilisé avec l'élément input pour définir les valeurs possibles de l'entrée.

javascript

html

css

Utilisé pour décrire les détails d'un document ou d'une certaine partie du document. citations, etc. Il doit être cohérent avec le contenu principal de la page. Les autres contenus séparés par contenu

L'attribut Ouvrir est développé par défaut

< titre de l'élément

Miaowei Classroom

Un établissement de formation informatique bien connu en Chine< /p>

Définir un dialogue

< dt>Professeur

2 +2 est égal ?

Étudiant

4

Enseignant

Bonne réponse !

Définit les coordonnées de l'auteur de la publication ou de la page

< ;mark> Mots ou phrases qui doivent être marqués

Utilisateur :

Clé publique :

Définir la barre de progression

76

tag

Pour les navigateurs comme IE6-8 qui ne prennent pas en charge les balises sémantiques HTML5, nous pouvons utiliser javascript pour les résoudre comme suit :

Ajouter en tête de page :

<script></p> <p>document.createElement("header");</p> <p>document.createElement(" nav");</p> <p>document.createElement("footer");</p> <p>......</p> <p></script>

Style

Balises sémantiques HTML5 sous IE6-8, après les avoir créées avec js, elles n'auront pas de style par défaut ni même d'affichage, il faut donc définir l'affichage par défaut de ces balises dans la feuille de style

Nouveau contrôle de saisie

e-mail : zone de texte de l'e-mail, pas différente des cases ordinaires. Lorsque la saisie n'est pas un e-mail, la vérification échoue.

tél : numéro de téléphone.

url : URL de la page Web

recherche : après avoir saisi du texte dans le moteur de recherche Chrome, il y aura une plage X

fermée supplémentaire : sélecteur de valeur dans une plage spécifique min, max, step (nombre de pas) Exemple : Utiliser JS pour afficher la valeur actuelle

Nouvelle entrée control_2

numéro : une zone de saisie qui ne peut contenir que des chiffres

color : Sélecteur de couleurs

datetime : Afficher la date complète

datetime-local : Afficher la date complète sans fuseau horaire

time : Afficher l'heure sans fuseau horaire

date : Afficher la date

semaine : Afficher la semaine

mois : Afficher le mois

Nouvelles caractéristiques et fonctions du formulaire

espace réservé : Zone de saisie Exemple d'invite information : Invite de boîte de mot de passe Weibo

complétion automatique : si l'enregistrement de la valeur de saisie de l'utilisateur est activé par défaut. Pour désactiver l'invite, sélectionnez désactiver

mise au point automatique : Spécifiez le formulaire pour obtenir le focus de saisie<.>

list et datalist : Construisez une liste de sélection pour la zone de saisie. La valeur de la liste est l'identifiant de la balise datalist

obligatoire : cet élément est obligatoire et ne peut pas être vide

Modèle : motif de vérification régulier="d{1 ,5}"

Vérification du formulaire

objet de validité Vous pouvez vérifier si la vérification est réussie via les éléments suivants valides. true sera renvoyé. Si une vérification échoue, false sera renvoyé

oText.addEventListener("invalid",fn1,false);

ev.preventDefault()

valueMissing : lorsque la valeur d'entrée est vide

typeMismatch : la valeur de contrôle correspond à l'incompatibilité de type attendue

patternMismatch : la valeur d'entrée ne répond pas à la régularité du modèle

tropLong : dépasse la maxLength maximum limit

rangeUnderflow : la valeur minimale de la plage vérifiée

rangeOverflow : La valeur maximale de la plage vérifiée

stepMismatch : Vérifiez si la valeur actuelle de la plage est conforme à la règles de min, max et step

customError n'est pas conforme à la vérification personnalisée

setCustomValidity(); Validation personnalisée

Événement invalide : retour de validation

entrée .addEventListener('invalid',fn,false)

Empêcher la validation par défaut : ev.preventDefault()

attribut formnovalidate : désactiver la validation

Formaction Définir l'adresse de soumission dans soumettre

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!