Maison > interface Web > Questions et réponses frontales > Quelle est la différence entre HTML et HTML5

Quelle est la différence entre HTML et HTML5

醉折花枝作酒筹
Libérer: 2023-01-04 09:34:46
original
7351 Les gens l'ont consulté

Différences : 1. En termes de déclaration de document, le code html est très long et difficile à retenir alors que la déclaration de html5 est relativement simple, avec la syntaxe "<!DOCTYPE html>". 2. HTML n'a pas de balises qui reflètent la sémantique structurelle, mais HTML5 ajoute de nombreuses nouvelles balises sémantiques. 3. HTML5 peut dessiner, mais HTML ne le peut pas.

Quelle est la différence entre HTML et HTML5

L'environnement d'exploitation de ce tutoriel : système Windows 7, version HTML5, ordinateur Dell G3.

1. Les déclarations de type de document sont différentes

html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Copier après la connexion

html5 : La déclaration de document est relativement plus simple et aide les programmeurs à lire et à développer rapidement.

<!DOCTYPE html>
Copier après la connexion

2. En termes de structure sémantique

<code>html: Il n'y a pas d'étiquette sémantique structurelle (en termes simples, elle est peu pratique à lire et ne vous le dit pas où est la tête et où est la queue)

<code>html5: ajoute de nombreuses balises sémantiques,

rend la structure du code claire et améliore la lisibilité du code.

Voici quelques balises sémantiques en html5 :

<code>< title></title> : courtes, descriptives, uniques (améliore le classement dans les moteurs de recherche)

<code><hn></hn> : h1~ h6 hiérarchique en-tête, utilisé pour créer des relations hiérarchiques entre les informations de la page.

<code><header></header> : L'en-tête comprend généralement le logo du site Web, la navigation principale, les liens à l'échelle du site et le champ de recherche.

convient également pour marquer un ensemble de contenus d'introduction ou de navigation au sein de la page.

<code><nav></nav> : navigation par marques, utilisée uniquement pour les groupes de liens importants dans le document.

<code><main></main> : Le contenu principal de la page, qui ne peut être utilisé qu'une seule fois sur une page. S'il s'agit d'une application web, entourez ses principales fonctions.

<code><article></article> : Représente un document, une page, une application ou un conteneur indépendant

<code><section></section> : Un groupe de contenu avec des thèmes similaires, comme la page d'accueil d'un site Web peut être divisé. dans les introductions et les actualités, les coordonnées, etc.

<code><aside></aside> : Spécifiez la colonne de la barre latérale, y compris les citations, les barres latérales, un ensemble de liens vers des articles, des publicités, des liens conviviaux, des listes de produits associés, etc.

<code><footer></footer> : Pied de page, uniquement lorsque le parent est le corps, c'est le pied de page de toute la page.

<code><small></small> : Précisez les détails et saisissez la clause de non-responsabilité, l'annotation, la signature et le droit d'auteur. À utiliser uniquement pour des phrases courtes, et non pour de longues déclarations juridiques telles que « Conditions d'utilisation » ou « Politique de confidentialité ».

<code><strong></strong> : Indique l'importance du contenu.

<code><em></em> : Marquez les points clés du contenu (largement utilisé pour améliorer la sémantique du texte du paragraphe).

En HTML5, em est le seul élément qui représente l'accent, tandis que strong représente l'importance.

<code><b></b> : Un bloc de texte qui rappelle au lecteur à des fins pratiques et ne véhicule aucune importance supplémentaire

<code><time></time> : Marque l'heure. L'attribut datetime suit un format spécifique. Si cet attribut est omis, le contenu du texte doit être dans un format de date ou d'heure légal. Les moments qui ne sont plus pertinents sont étiquetés avec s.

<code><abbr></abbr> : Explication des abréviations. Utilisez l'attribut title pour fournir le nom complet, ce qui est correct s'il est utilisé uniquement lors de la première occurrence.

abbr[title]{ 
    border-bottom:1px dotted #000;
 }
Copier après la connexion

<code><dfn></dfn> : élément de terme de définition, qui doit être immédiatement adjacent à la définition, et peut être utilisé dans l'élément dl de la liste de description.

<code><address></address> : Coordonnées (adresse e-mail, lien vers la page de contact) de l'auteur, de la personne ou de l'organisation concernée. Si vous fournissez les coordonnées de l'auteur pour la page entière, elles sont généralement placées dans le pied de page au niveau de la page. Il ne peut pas contenir de documents ou d'autres contenus tels que des documents.

<code><code> : code tag. Contient des exemples de code ou des noms de fichiers (< > )

<code><pre class="brush:php;toolbar:false"></pre> : texte préformaté. Préserve les sauts de ligne et les espaces inhérents au texte.

Fonction de dessin 3.html5

1) canevas

Avant HTML5, les développeurs Web front-end ne pouvaient pas dessiner dynamiquement des images sur des pages HTML. HTM5 ajoute un nouvel élément <code><canvas></canavas>, qui équivaut à un canevas. Cependant, il n'a pas la capacité de dessiner des images et un script doit être utilisé pour effectuer la tâche de dessin proprement dite. À l'aide de la méthode getContext, vous pouvez renvoyer un objet qui fournit les propriétés et les méthodes de peinture.

• Étape 1 : Récupérez l'objet <canvas></canavas>DOM

• Étape 2 : Appelez la méthode getContext() de l'objet Canvas pour obtenir l'objet CanvasRederingContext2D (passez un paramètre dans la méthode getContext : "2d")

• Étape 3 : Appelez CanvasRederingContext2D pour terminer le dessin

2) SVG : Scalable Vector Graphics, graphiques vectoriels utilisés pour définir le Web.

Partage de vidéos d'apprentissage : tutoriel vidéo HTML

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal