Maison interface Web tutoriel HTML Comment les balises HTML doivent-elles être imbriquées ?

Comment les balises HTML doivent-elles être imbriquées ?

Jan 25, 2018 am 11:22 AM
html 嵌套 comment

Cette fois je vais vous montrer comment imbriquer les balises html, et quelles sont les précautions pour imbriquer les balises html Voici un cas pratique, jetons un oeil.

Il existe de nombreuses balises XHTML : p, ul, li, dl, dt, dd, h1~h6, p, a, addressa, span, strong... Quand on utilise ces balises pour construire la structure de la page , Ils peuvent être imbriqués à l'infini, mais l'imbrication nécessite également certaines règles. Vous ne pouvez pas permettre que vos propres habitudes personnelles soient imbriquées de manière aléatoire. Alors, quelles sont les règles d'imbrication pour la balise html  ?

1. Les balises HTML incluent des éléments de niveau bloc (block) et des éléments en ligne (inline)

1. Les éléments de niveau bloc

sont généralement utilisés pour créer un site Web architecture , mise en page, contenu... Il comprend les balises suivantes :

address、blockquote、center、dir、p、dl、dt、dd、fieldset、form、h1~h6、hr、isindex、menu、noframes、noscript、ol、p、pre、table、ul
Copier après la connexion
2. Les éléments en ligne

sont généralement utilisés dans certains détails ou parties du contenu du site Web. pour "accentuer, distinguer les styles, les exposants, les indices,

ancrer ", etc. Les balises suivantes sont toutes des éléments incorporés :

 a、abbr、acronym、b、bdo、big、br、cite、code、dfn、em、font、i、img、input、kbd、label、q、s、samp、select、small、span、strike、strong、sub、sup、textarea、tt、u、var
Copier après la connexion
2. Intégration des balises HTML Ensemble de règles

1. Les éléments de bloc peuvent contenir des

éléments en ligne ou certains éléments de bloc, mais les éléments en ligne ne peuvent pas contenir d'éléments de bloc, ils ne peuvent contenir que d'autres éléments en ligne :

 <p><h1></h1><p></p></p> —— 对</p>< p>  <a href=”#”><span></span></a> —— 对</p>< p>  <span><p></p></span> —— 错
Copier après la connexion
2. Les éléments de niveau bloc ne peuvent pas être placés à l'intérieur de

 :


<p><ol><li></li></ol></p> —— 错</p>< p>  <p><p></p></p> —— 错
Copier après la connexion
3 Il existe plusieurs éléments spéciaux de niveau bloc. Ils ne peuvent contenir que des éléments en ligne. ne contient plus d'éléments de niveau bloc. Ces balises spéciales sont :

 h1、h2、h3、h4、h5、h6、p、dt
Copier après la connexion

4. li peut contenir des balises p - celle-ci n'a pas besoin d'être répertoriée séparément, mais de nombreuses personnes sont dessus. les Internet ont quelques doutes à ce sujet, je vais donc l'expliquer brièvement ici :

Les balises li et p sont toutes deux des conteneurs de chargement de contenu, avec un statut égal et sans distinction de niveau (par exemple : h1, h2, etc. . Hiérarchie stricte ^_^), vous savez, la balise li peut même accueillir son parent ul ou ol Pourquoi certaines personnes pensent-elles que li ne peut pas accueillir un p ? Ne pensez pas que Li est si avare, même si Li a l'air assez mince, en fait Li a un grand cœur...

5 Les éléments de niveau bloc sont juxtaposés aux éléments de niveau bloc et aux éléments en ligne. sont en ligne avec des éléments en ligne :

      <p><h2></h2><p></p></p> —— 对</p>< p>  <p><a href=”#”></a><span></span></p> —— 对</p>< p>  <p><h2></h2><span></span></p> —— 错
Copier après la connexion
Je pense que vous maîtrisez la méthode après avoir lu ces cas. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lectures associées :

Comment utiliser HTML et CSS pour formuler des idées claires

Comment écrire de manière flexible, stable, Code HTML et CSS de haute qualité

Comment utiliser les balises de titre et les balises de paragraphe en XHTML

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!

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

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
Will R.E.P.O. Vous avez un jeu croisé?
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Bordure de tableau en HTML 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.

Marge gauche HTML 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.

Tableau imbriqué 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.

Disposition du tableau HTML 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 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 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 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 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.

See all articles