2.3 段落

一块块砖瓦组合就建成了高楼大厦，一行行文字组合就形成了段落篇章。在实际的文本编码中，在输入完一段文字后，按下＜Enter＞键就生成了一个段落，但是在 HTML5 中需要通过标签来实现段落的效果。下面具体介绍与段落相关的一些标签。

2.3.1 段落标签

在 HTML5 中，段落效果是通过＜p＞标签来实现的。＜p＞标签会自动在其前后创建一些空白，浏览器则会自动添加这些空间。

语法格式如下：

其中，可以使用成对的＜p＞标签来包含段落，也可以使用单独的＜p＞标签来划分段落。

接下来，使用＜p＞标签，实现明日学院内容介绍的页面展示。首先结合特殊文字符号将“明日学院，专注编程十八年”放入段落标签中，然后将明日学院的具体介绍内容分别放在段落标签中，最后结合特殊文字符号将明日学院的网址放入底部的段落标签中。具体代码如下（实例位置：资源包\MR\源码\02\06）：

运行效果如图2.9所示。

2.3.2 段落的换行标签

段落与段落之间是隔行换行的，这样会导致文字的行间距过大，这时可以使用换行标签来完成文字的紧凑换行显示。

语法格式如下：

其中，＜br/＞标签代表换行。如果要多次换行，则可以连续使用多个换行标签。

接下来，巧用＜br/＞换行标签，实现唐诗《望庐山瀑布》中诗句的页面布局。通常可以使用多个＜p＞段落标签达到换行的目的，也可以使用＜br/＞换行标签，在＜p＞段落标签内部进行换行。具体代码如下（实例位置：资源包\MR\源码\02\07）：

运行效果如图2.10所示。

常见错误

＜br/＞换行标签的语法比较特殊，它并不是由开始标签和结束标签组成的，所以初学者经常会写错。例如，在下面代码的第4行，就将＜br/＞换行标签错误地写成了＜b/r＞。

将会出现如图2.11所示的错误界面。

2.3.3 段落的原始排版标签

在网页的制作过程中，一般是通过各种标签对文字进行排版的。但在实际应用中，往往需要一些特殊的排版效果，这时使用标签控制非常麻烦。解决的方法就是使用原始排版标签＜pre＞进行排版，如空格、制表符等。

语法如下：

接下来，使用＜pre＞原始排版标签，绘制一幅“元旦快乐”的字符画。＜pre＞原始排版标签会保留代码中的原始文字格式，利用此特性，可以通过键盘上的特殊符号绘制出多种多样的字符画效果。本实例中使用键盘上的＜o＞键，绘制了一幅“元旦快乐”的字符画，可爱生动，表现力强。具体代码如下（实例位置：资源包\MR\源码\02\08）：

运行效果如图2.12所示。