Quelle est la différence entre HTML et HTML5
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.
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">
html5 : La déclaration de document est relativement plus simple et aide les programmeurs à lire et à développer rapidement.
<!DOCTYPE html>
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;
}<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!
Outils d'IA chauds
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Undress AI Tool
Images de déshabillage gratuites
Clothoff.io
Dissolvant de vêtements AI
Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Sujets chauds
Bordure de tableau en HTML
Sep 04, 2024 pm 04:49 PM
Guide de la bordure de tableau en HTML. Nous discutons ici de plusieurs façons de définir une bordure de tableau avec des exemples de bordure de tableau en HTML.
Tableau imbriqué en HTML
Sep 04, 2024 pm 04:49 PM
Ceci est un guide des tableaux imbriqués en HTML. Nous discutons ici de la façon de créer un tableau dans le tableau ainsi que des exemples respectifs.
Marge gauche HTML
Sep 04, 2024 pm 04:48 PM
Guide de la marge HTML gauche. Nous discutons ici d'un bref aperçu de la marge gauche HTML et de ses exemples ainsi que de son implémentation de code.
Disposition du tableau HTML
Sep 04, 2024 pm 04:54 PM
Guide de mise en page des tableaux HTML. Nous discutons ici des valeurs de la mise en page des tableaux HTML ainsi que des exemples et des résultats en détail.
Espace réservé d'entrée HTML
Sep 04, 2024 pm 04:54 PM
Guide de l'espace réservé de saisie HTML. Nous discutons ici des exemples d'espace réservé d'entrée HTML ainsi que des codes et des sorties.
Liste ordonnée HTML
Sep 04, 2024 pm 04:43 PM
Guide de la liste ordonnée HTML. Ici, nous discutons également de l'introduction de la liste et des types HTML ordonnés ainsi que de leur exemple respectivement.
Déplacer du texte en HTML
Sep 04, 2024 pm 04:45 PM
Guide pour déplacer du texte en HTML. Nous discutons ici d'une introduction, du fonctionnement des balises de sélection avec la syntaxe et des exemples à implémenter.
Bouton HTML onclick
Sep 04, 2024 pm 04:49 PM
Guide du bouton HTML onclick. Nous discutons ici de leur introduction, de leur fonctionnement, des exemples et de l'événement onclick dans divers événements respectivement.
