《HTML、CSS和JavaScript入门经典》笔记——HTML标签小结

2023年3月22日 90次阅读
标签作用
<html>…</html>封闭整个HTML文档
<head>…</head>封闭HTML文档的头部。在<html>标签对内使用
<title>…</title>指示文档的页面标题。在<head>标签对内使用
<body>…</body>封闭HTML文档的主体。在<html>标签对内使用
<p>…</p>封闭段落，在段落之间跳过一行
<br />指示换行符
<hr />显示水平标线
<h1>…</h1>封闭1级标题
<h2>…</h2>封闭2级标题
<h3>…</h3>封闭3级标题
<h4>…</h4>封闭4级标题
<h5>…</h5>封闭5级标题
<h6>…</h6>封闭6级标题
<header>…</header>包含介绍性信息
<footer>…</footer>包含关于其包含元素的补充材料（通常是版权通知或作者信息）
<nav>…</nav>包含导航元素
<section>…</section>包含主题上类似的内容，比如一本书中的某一章或一个页面的某个区域
<article>…</article>包含一段独立的内容，比如新闻文章
<aside>…</aside>包含关于其包含元素的辅助信息
<address>…<address>包含与其最近的<article>或<body>元素相关的地址信息，通常包含在<footer>元素内

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 1 <!DOCTYPE html>
 2 
 3 <html lang="en">
 4     <head>
 5         <title>Semantic Example</title>
 6     </head>
 7     <body>
 8         <header>
 9             <h1>SITE OR PAGE LOGO GOES HERE</h1>
10         </header>
11         <nav>
12             SITE OR PAGE NAV GOES HERE
13         </nav>
14         <article>
15             <header>
16                 <h2>Article Heading</h2>
17             </header>
18             <section>
19                 <header>
20                     <h3>Section 1 heading</h3>
21                 </header>
22                 <p>Section 1 content here.</p>
23             </section>
24             <section>
25                 <header>
26                     <h3>Section 2 heading</h3>
27                 </header>
28                 <p>Section 2 content here.</p>
29             </section>
30             <footer>
31                 <p>Article footer goes here.</p>
32             </footer>
33         </article>
34         <footer>
35             SITE OR PAGE FOOTER HERE
36         </footer>
37     </body>
38 </html>

 

点赞