html5 title tags include: 1. title tag, which defines the title of the document; 2. h1, h2, h3, h4, h5, h6 tags, which define the content title; 3. caption tag, which defines the table title; 4 , figcaption tag; 5. legend tag; 6. summary tag.
The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.
html5 title tag
1、 tag
The tag defines the title of the document and is required in all HTML documents. <p></p>
<title> Element: <ul style="list-style-type: disc;">
<li><p> Defines the title in the browser toolbar </p></li>
<li><p> Provides the page to be added to the collection The title when clipped </p></li>
<li><p>The page title that appears in search engine results</p></li>
</ul><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>php中文网</title>
</head>
<body>
...
</body>
</html></pre><div class="contentsignin">Copy after login</div></div><p><img src="https://img.php.cn/upload/image/616/738/796/1639375311415707.png"/ alt="What is the title tag in html5" ></p><p><strong> 2. <h1> to <h6> tag</strong></p><p><h1> - <h6> tag can define the title. <h1> defines the largest heading. <h6> Defines the smallest heading. </p><p>Because the h element has exact semantics, please carefully choose the appropriate tag level to structure the document. Therefore, please do not use title tags to change the font size within the same line. Instead, we should use cascading style sheet definitions to achieve beautiful display effects. </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<h5>这是标题 5</h5>
<h6>这是标题 6</h6></pre><div class="contentsignin">Copy after login</div></div><p><img src="https://img.php.cn/upload/image/821/247/630/1639723578130899.png" title="1639723578130899.png" alt="What is the title tag in html5"/></p><p><strong>3. <caption> tag</strong></p><p>caption element defines the table title. </p><p>The caption label must immediately follow the table label. You can define only one title per table. Usually the title will be centered above the table. </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><table border="1">
<caption>人物信息</caption>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>Peter</td>
<td>20</td>
</tr>
<tr>
<td>Lois</td>
<td>20</td>
</tr>
</table></pre><div class="contentsignin">Copy after login</div></div><p><img src="https://img.php.cn/upload/image/621/435/193/163393472683908What is the title tag in html5"/ alt="What is the title tag in html5" ></p><p><strong>4. The <figcaption> tag</strong></p>##<figcaption> tag defines the title for the <figure> element. <p></p>The<figcaption> element should be placed as the first or last child of the <figure> element. <p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><!DOCTYPE HTML>
<html>
<body>
<p>上海卢浦大桥是当今世界第一钢结构拱桥，是世界上跨度最大的拱形桥。它也是世界上首座完全采用焊接工艺连接的大型拱桥（除合拢接口采用栓接外），现场焊接焊缝总长度达4万多米，接近上海市内环高架路的总长度。卢浦大桥像澳大利亚悉尼的海湾大桥一样具有旅游观光的功能。</p>
<figure>
<figcaption>黄浦江上的的卢浦大桥</figcaption>
<p>拍摄者：W3School 项目组，拍摄时间：2010 年 10 月</p>
<img src="/i/shanghai_lupu_bridge.jpg" style="max-width:90%" style="max-width:90%" / alt="What is the title tag in html5" >
</figure>
</body>
</html></pre><div class="contentsignin">Copy after login</div></div></p><p><img src="https://img.php.cn/upload/image/144/462/837/163972384099696What is the title tag in html5" title="163972384099696What is the title tag in html5" alt="What is the title tag in html5"/></p><p>5. The <legend> tag<strong></strong></p>legend element defines the title (caption) for the fieldset element. <p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><!DOCTYPE HTML>
<html>
<body>
<form>
<fieldset>
<legend>健康信息</legend>
身高：<input type="text" />
体重：<input type="text" />
</fieldset>
</form>
<p>如果表单周围没有边框，说明您的浏览器太老了。</p>
</body>
</html></pre><div class="contentsignin">Copy after login</div></div></p><p><img src="https://img.php.cn/upload/image/203/296/619/163972394541092What is the title tag in html5" title="163972394541092What is the title tag in html5" alt="What is the title tag in html5"/></p><p>6. <summary> tag<strong></strong></p><summary> The tag defines a visible element for the <details> title. Detailed information is displayed when the user clicks on the title. <p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><!DOCTYPE HTML>
<html>
<body>
<details>
<summary>HTML 5</summary>
This document teaches you everything you have to learn about HTML 5.
</details>
</body>
</html></pre><div class="contentsignin">Copy after login</div></div><p><img src="https://img.php.cn/upload/image/398/406/806/1639724013276498.gif" title="1639724013276498.gif" alt="What is the title tag in html5"></p>Related recommendations: "<p>html video tutorial<a href="http://www.php.cn/course/list/11.html" target="_blank" textvalue="html视频教程">"</a></p>
The above is the detailed content of What is the title tag in html5. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
