Refer to the Netpath HTML tutorial for part of this article

<h1> ~ <h6>

H1 ~ H6 are used to represent the title of the article, and the importance of the six headings decreases from H1 to H6.

By default, browsers display headings in bold, decreasing font size from H1 to H6. Generally, there is only one H1 heading per page.

<body>
  <h1>The title</h1>
  <h2>subtitle</h2>
</body>
Copy the code

<nav>

The NAV tag is used to place navigation information for a page or document.

<nav>
  <ol>
    <li><a href="news">news</a></li>
    <li><a href="picture">The picture</a></li>
    <li><a href="car">The car</a></li>
    <li><a href="sport">sports</a></li>
  </ol>
</nav>
Copy the code

<article>

Article is usually used to refer to an article or a forum post.

<article>
  <h2>The first chapter</h2>
  <p>The passage...</p>
  <h2>The second chapter</h2>
  <p>Document paragraph...</p>
</article>
Copy the code

<section>

The section tag represents a separate section that contains a topic. It is usually used in a document to represent a chapter. For example, an article can contain multiple sections.

<article>
  <section>
    <h2>The first chapter</h2>
    <p>Content...</p>
  </section>
  <section>
    <h2>The second chapter</h2>
    <p>Content...</p>
  </section>
</article>
Copy the code

Sections are good for a slide show page, and each section represents a slide.

<p>

P is a paragraph. Not just text, but anything you want to display as a paragraph, such as images and form items, can be put in the P element.

<p>Paragraph text paragraph text paragraph text<img src="demo.jpg">
</p>
Copy the code

<header>

The header can represent the header of an entire web page, an article, or a block.

<! -- Page header -->
<body>
  <header>
    <h1>Page logo</h1>
  </header>
</body>
Copy the code
<! -- Head of article -->
<article>
  <header>
    <h2>The article title</h2>
  </header>
</article>
Copy the code

<main>

Main indicates the main content of a page. A page can have only one main.

<header>
  <h2>Page logo</h2>
</header>
<main>
  <section>Block a</section>
  <section>Block 2</section>
</main>
Copy the code

<aside>

Aside tags are used to place things that are indirectly related to the main content of a web page or article.

  • Web levelaside, can be used to place a sidebar, but not necessarily on the side of the page;
  • Article levelasideCan be used to place comments or comments.
<! Aside -->
<main>Web page subject</main>
<aside>The sidebar</aside>
Copy the code
<! Aside -->
<p>Content of the paragraph</p>
<aside>A comment or commentary.</aside>
Copy the code

<footer>

The footer tag represents the end of a page, article, or chapter.

<! -- End of page -->
<header>Page header</header>
<main>Web page subject</main>
<footer>Web page foot</footer>
Copy the code
<! -- End of article -->
<article>
  <header>
    <h1>The article title</h1>
  </header>
  <footer>
    <p>© Reposting is prohibited</p>
  </footer>
</article>
Copy the code

<div>

Div represents a block or container and has no semantics.

<article>
  <div>
    <p>Paragraph a</p>
  </div>
  <div>
    <p>Paragraph 2</p>
  </div>
</article>
Copy the code