Concevoir des pages Web à l'aide de code sémantique HTML5

Auteur：Eve Cole Date de mise à jour：2025-03-27 06:00:02

Tout d'abord, nous voulons déclarer et créer le type de document, nous n'utilisons plus HTML 4 ou XHTML 1.0 comme public - // w3c // dtd xhtml 1.0 transitionnel ..... Déclaration, nous pouvons écrire de cette façon:

 <! Doctypehtml>

Jetez un œil, c'est simple et évident, insensible à la casse. Il est plus facile d'être compatible en arrière. Au moins, cela peut vous faire gagner du temps pour taper.

Nous avons maintenant défini le type du document HTML 5. Tout s'est bien passé jusqu'à présent. Maintenant, jetons un coup d'œil aux nouvelles étiquettes pour HTML5. Avant de naviguer dans le nouvel onglet, regardons comment nous écrivons habituellement:

 <html>
 <adal>
 ...autre...
 </ head>
 <body>
 <divid = en-tête>
 <h1> CSS3-HTML5 Home </H1>
 </div>
 <divid = nav>
 <ul>
 <li> Home </li>
 <li> À propos de </li>
 <li> Contact </li>
 </ul>
 </div>
 <divid = contenu>
 <h1> Titre </H1>
 <p> ... </p>
 </div>
 <divid = pieds>
 <p> Informations sur le droit d'auteur </p>
 </div>
 </docy>
 </html>

L'utilisation de <v> dans l'exemple ci-dessus est maintenant une pratique très courante. Son but est double. Tout d'abord, il fournit un ID d'identité unique qui peut être appliqué spécifiquement aux chapitres de page Web. Deuxièmement, l'identification est comme une structure pseudo-sémantique primitive. Les noms d'identification de chaque site Web peuvent être différents, il est donc difficile pour nous de comprendre ce que signifient ces identifiants.

<Aider> Tag:

La balise <-en-tête> équivaut à celle que nous définissons habituellement avec <div id = en-tête>. Si votre site Web est toujours défini comme celui-ci avec <div id = header>, nous pouvons maintenant le remplacer par <en-tête>.

<NAV> TAG:

<Nav> est la balise de navigation, tout comme nous utilisons habituellement:

<ul>

<li> Index </li>

...

</ul>

</div>

Utilisez maintenant <Nav>:

 <Nav>
 <ul>
 <li> <href = index.html> Home </a> </li>
 <li> <href = / about / about / about </a> </li>
 <li> <href = / blog /> blog </a> </li>
 </ul>
 </ nav>

<Action> TAG: La balise <ction> peut être un groupe de groupes de contenu ou de sujets, généralement avec une balise de démarrage et une balise finale. Bien sûr, cette balise peut également être imbriquée.

<Article> TAG: Il peut y avoir une section de contenu dans la balise <Bection>.

<à part

<Afether> TAG: <footer> Tag, si vous ne le dites pas, vous pouvez comprendre à quoi cela sert. Il peut également y avoir plusieurs, généralement au bas du site Web.

Jetons un coup d'œil au dernier code:

 <! Doctypehtml>
 <html>
 <adal>
 ...truc...
 </ head>
 <body>
 <dique>
 <h1> mysite </h1>
 </-header>
 <Nav>
 <ul>
 <li> Home </li>
 <li> À propos de </li>
 <li> Contact </li>
 </ul>
 </ nav>
 <segction>
 <h1> Myarticle </H1>
 <Re article>
 <p> ... </p>
 </article>
 </ section>
 <foomer>
 <p> ... </p>
 </fooder>
 </docy>
 </html>

Grâce au code, il est plus concis et plus facile à comprendre, non?