• 技术文章 >web前端 >前端问答

    html5中标题标签是什么

    青灯夜游青灯夜游2021-12-17 14:57:36原创105

    html5标题标签有:1、title标签,定义文档的标题;2、h1、h2、h3、h4、h5、h6标签,定义内容标题;3、caption标签,定义表格标题;4、figcaption标签;5、legend标签;6、summary标签。

    本教程操作环境:windows7系统、HTML5版、Dell G3电脑。

    html5标题标签

    1、<title> 标签

    <title> 标签定义文档的标题,在所有 HTML 文档中是必需的。

    <title>元素:

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <title>php中文网</title>
    </head>
    <body>
    ...
    </body>
    </html>

    2、<h1> to <h6>标签

    <h1> - <h6> 标签可定义标题。<h1> 定义最大的标题。<h6> 定义最小的标题。

    由于 h 元素拥有确切的语义,因此请您慎重地选择恰当的标签层级来构建文档的结构。因此,请不要利用标题标签来改变同一行中的字体大小。相反,我们应当使用层叠样式表定义来达到漂亮的显示效果。

    <h1>这是标题 1</h1>
    <h2>这是标题 2</h2>
    <h3>这是标题 3</h3>
    <h4>这是标题 4</h4>
    <h5>这是标题 5</h5>
    <h6>这是标题 6</h6>

    2.png

    3、<caption>标签

    caption 元素定义表格标题。

    caption 标签必须紧随 table 标签之后。您只能对每个表格定义一个标题。通常这个标题会被居中于表格之上。

    <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>

    4、<figcaption>标签

    <figcaption> 标签为 <figure> 元素定义标题。

    <figcaption> 元素应该被置于 <figure> 元素的第一个或最后一个子元素的位置。

    <!DOCTYPE HTML>
    <html>
    <body>
    
    <p>上海卢浦大桥是当今世界第一钢结构拱桥,是世界上跨度最大的拱形桥。它也是世界上首座完全采用焊接工艺连接的大型拱桥(除合拢接口采用栓接外),现场焊接焊缝总长度达4万多米,接近上海市内环高架路的总长度。卢浦大桥像澳大利亚悉尼的海湾大桥一样具有旅游观光的功能。</p>
    
    <figure>
      <figcaption>黄浦江上的的卢浦大桥</figcaption>
      <p>拍摄者:W3School 项目组,拍摄时间:2010 年 10 月</p>
      <img src="/i/shanghai_lupu_bridge.jpg" width="350" height="234" />
    </figure>
    
    </body>
    </html>

    3.png

    5、<legend>标签

    legend 元素为 fieldset 元素定义标题(caption)。

    <!DOCTYPE HTML>
    <html>
    
    <body>
    
    <form>
      <fieldset>
        <legend>健康信息</legend>
        身高:<input type="text" />
        体重:<input type="text" />
      </fieldset>
    </form>
    
    <p>如果表单周围没有边框,说明您的浏览器太老了。</p>
    
    </body>
    </html>

    4.png

    6、<summary>标签

    <summary> 标签为 <details> 元素定义一个可见的标题。 当用户点击标题时会显示出详细信息。

    <!DOCTYPE HTML>
    <html>
    <body>
    
    <details>
    <summary>HTML 5</summary>
    This document teaches you everything you have to learn about HTML 5.
    </details>
    
    </body>
    </html>

    1.gif

    相关推荐:《html视频教程

    以上就是html5中标题标签是什么的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:html5 标题标签
    上一篇:html5中哪个属性用于规定输入字段必填 下一篇:html5里边caption是什么意思

    相关文章推荐

    • html5中将元素隐藏的语法是什么• html5中br标签是什么缩写• html5布局元素有哪几个• html5设置透明度的代码是什么• html5表单新特性有哪些• html5中ruby标签的含义是什么

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网