Quels sont les éléments structurels couramment utilisés en HTML ?

Les éléments structurels couramment utilisés en HTML sont : 1. div, qui peut définir des partitions ou des sections dans le document, et est utilisé pour fournir la structure et l'arrière-plan du contenu au niveau des blocs dans le document HTML 2. section, qui représente le contenu ; dans le document. Une région ; 3. un article, représente une structure indépendante dans un document, une page, une application ou un site Web, qui est destinée à être une structure attribuable ou réutilisable de manière indépendante. 4. à part, représente une partie qui n'a pas grand-chose à voir avec ; le reste du contenu de la page ; 5. En-tête : l'en-tête de la page ou l'en-tête du bloc.

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

Les éléments structurels, également appelés éléments de bloc, sont des éléments utilisés pour définir la plage de contenu des blocs. Auparavant, il n'y avait qu'un seul élément de bloc

. HTML5 ajoutait 7 nouveaux éléments structurels sémantiques, notamment

,

;,

Éléments structurels couramment utilisés en HTML

éléments div

Les éléments div sont utilisés pour créer de gros blocs (au niveau du bloc) le contenu fournit des éléments de structure et de contexte.

peut définir des divisions ou des sections (division/section) dans le document. La balise

peut diviser le document en parties indépendantes et différentes. Il peut être utilisé comme un outil d’organisation strict et n’utilise aucun formatage qui lui est associé.

Si vous marquez

avec un identifiant ou une classe, la balise deviendra plus efficace.

Remarque :

est un élément de niveau bloc, ce qui signifie que les navigateurs placent généralement un saut de ligne avant et après l'élément div.

Astuce : utilisez l'élément

pour regrouper les éléments au niveau du bloc afin qu'ils puissent être formatés à l'aide de styles.

élément section

L'élément Section (

) représente une zone (ou une section) dans le document et est un élément commun au niveau du bloc. Par exemple, un groupe de sujets dans le contenu comprendra généralement un titre. Généralement, chaque

　[Remarque] Si le contenu de l'élément peut être divisé en plusieurs parties, vous devez utiliser

au lieu de

. un conteneur ordinaire. C'est ainsi que

De manière générale, un élément

doit apparaître dans le plan du document

élément article

L'élément

Structures réutilisables. Il peut s'agir d'un message sur un forum, d'un magazine ou d'un article d'actualité, d'un blog, d'un commentaire soumis par l'utilisateur, d'un composant interactif ou de tout autre élément de contenu indépendant. Lorsque l'élément

est utilisé imbriqué, l'élément représente l'article lié à l'élément externe. Par exemple, un élément

représentant un commentaire de blog peut être imbriqué dans un élément

représentant un article de blog

Les informations sur l'auteur de l'élément

mais cela ne fonctionne pas avec l'imbrication. L'élément

, la date et l'heure de publication de l'élément

peuvent être représentés par l'attribut pubdate de l'élément et

, il faut ajouter L'élément

aside dans le titre

　L'élément

représente une partie qui n'a presque aucun rapport avec le reste du contenu de la page. partie indépendante du contenu et peut être séparé séparément sans affecter l’ensemble. Généralement utilisé pour représenter des barres latérales qui ne sont pas directement liées au contenu. Le contenu dans

est indépendant du contenu auquel il est associé. L'absence de l'un ou l'autre n'affectera pas la compréhension de la signification des textes respectifs. Tels que la publicité d'un article, le contenu de l'arrière-plan et de la citation, etc.

élément de navigation

La barre de navigation HTML (

) représente une zone contenant plusieurs hyperliens. Cette zone contient des liens vers d'autres pages ou à l'intérieur de la page. . Liste de liens dans d'autres parties

Tous les liens ne doivent pas nécessairement utiliser l'élément

. Il est uniquement utilisé pour placer certains liens populaires dans la barre de navigation. Par exemple, l'élément

ajoutez une liste de liens

Une page Web peut également contenir plusieurs éléments

, par exemple, l'un est la liste de navigation au sein du site Web et l'autre est la liste de navigation au sein de cette page

élément d'en-tête.

　L'élément

représente l'en-tête de page ou l'en-tête de bloc, qui est utilisé pour regrouper le contenu d'introduction et la navigation auxiliaire du bloc, il peut donc contenir l'élément de titre du bloc et d'autres contenus d'introduction (Catalogue , logo, etc.)

　 [Remarque] Étant donné que les éléments

et

ne sont pas du contenu de section, les nouvelles sections ne seront pas introduites dans le plan

footer element

　 L'élément

Le pied de page de l’élément racine de sectionnement. Un pied de page contient généralement des informations telles que l'auteur du chapitre, des données de droits d'auteur ou des liens liés au document

　[Remarque] Les informations sur l'auteur dans l'élément doivent être incluses dans l'élément :

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>苹果首页</title>
</head>
<body>
<nav>
  <ul>
    <li><a href="#">Apple</a></li>
    <li><a href="#">Mac</a></li>
    <li><a href="#">iPad</a></li>
    <li><a href="#">iPhone</a></li> 
    <li><a href="#">Watch</a></li> 
    <li><a href="#">Music</a></li> 
    <li><a href="#">技术支持</a></li> 
    <li><a href="#">搜索</a></li> 
    <li><a href="#">购物袋</a></li>           
  </ul>
</nav>
<article>
  <section>展示1</section>
  <section>展示2</section>
  <section>展示3</section>
  <section>展示4</section>
  <nav>
    <ul>
      <li>按钮1</li>
      <li>按钮2</li>
      <li>按钮3</li>
      <li>按钮4</li>
    </ul>
  </nav>
</article>
<aside>
  <ul>
    <li><a href="#">Watch</a></li>
    <li><a href="#">Pencil</a></li>
    <li><a href="#">iPad</a></li>
    <li><a href="#">MacBook</a></li>
  </ul>
</aside>
<footer>
  <nav>
    <div>选购及了解</div>
    <div>商店</div>
    <div>应用</div>
    <div>账户</div>
    <div>关于</div>
  </nav>
  <section>
    <div>其他杂项</div>
  </section>
</footer>
</body>
</html>

Explication : main

n'est pas couramment utilisé. La raison principale est que les navigateurs IE ne le prennent pas en charge. ; ou la partie principale de la demande. La partie principale est constituée de contenus directement liés au document ou s'étendant au thème central du document ou à la partie fonctionnelle principale de l'application. Cette partie du contenu doit être unique dans le document et ne contenir aucun contenu répété dans une série de documents. La balise

ne peut pas être un héritage des éléments suivants, notamment

,

,

ou

. Plus d'une balise

ne peut pas apparaître dans un document

Une mise en page normale à l'extérieur devrait donc être la suivante

<header></header>
<main>
  <section></section>
  <section></section>
  <section></section>
</main>
<footer></footer>

Mais maintenant, en général, la mise en page est la suivante

<header></header>
<section></section>
<section></section>
<section></section>
<footer></footer>

(Partage de vidéos d'apprentissage :

Web Pour commencer avec l'avant

)

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!