2.1 标题
标题是对一段文字内容的概括和总结。书籍文本不能没有标题，网页文本也不能没有标题。一篇文档的好坏，标题起重要作用。在越来越追求“视觉美感”的今天，一个好的标题设计，对用户的留存尤为关键。例如，图2.1和图2.2所示的界面效果，同样的标题内容，使用了不同的网页标签，显示的效果大相径庭。
图2.1 较好的标题设计
图2.2 糟糕的标题设计
2.1.1 标题标签
标题标签共有6个，分别是<h1>、<h2>、<h3>、<h4>、<h5>和<h6>，每个标签在字体大小上有明显的区别，从<h1>标签到<h6>标签字体依次变小。<h1>标签表示最大的标题，<h6>标签表示最小的标题。一般使用<h1>标签来表示网页中最上层的标题，有些浏览器会默认把<h1>标签显示为非常大的字体，因此一些开发者会使用<h2>标签代替<h1>标签来显示最上层的标题。
标题标签语法如下：
学习笔记
在HTML5中，标签大都是由起始标签和结束标签组成的。例如，<h1>标签在编码使用时，首先编写<h1>起始标签和</h1>结束标签，然后将文本内容放在两个标签之间。
接下来通过一个实例，巧用<h1>标签、<h4>标签和<h5>标签，实现一则关于程序员笑话的对话内容。首先把“程序猿的笑话”放入<h1>标签中，代表文章的标题，然后把发布时间、发布者和阅读数放入较小字号的<h5>标签中，最后把对话内容放入字号适中的<h4>标签中。具体代码如下：
本实例的运行效果如图2.3所示。
图2.3 运行效果
学习笔记
如果结束标签漏加“/”，如把</h1>写成<h1>，那么浏览器会认为它是新标题标签的开始，从而导致网页布局错乱。例如，在下面代码的第2行，就将</h1>结束标签写成了<h1>开始标签。
运行后会出现如图2.4所示的错误。
图2.4 结束标签漏加“/”出现的错误
2.1.2 标题的对齐方式
在默认情况下，标题文字是左对齐的。而在网页制作过程中，可以实现标题文字的编排设置。最常用的就是关于对齐方式的设置，可以为标题标签添加align属性进行设置，其语法格式如下：
在该语法中，align属性需要设置在标题标签的后面，具体的对齐方式属性值如表2.1所示。
表2.1 对齐方式属性值
学习笔记
在编写代码的过程中，请注意添加双引号。
接下来，使用标题标签中的align属性，实现图书商品介绍的文字展示。首先使用<h5>标题标签，将图书名称、作者、出版社等介绍内容放入标签内，然后在每个标题标签中添加align属性，属性值设为center。具体代码如下：
学习笔记
在上述代码的第11行使用了<img>图像标签。<img>图像标签可以将外部图片引入当前网页内。有关<img>图像标签的具体使用方法请参考本书第3章。
执行上面的代码，效果如图2.5所示。
图2.5 图书商品介绍的网页效果