3.3 设置段落格式
教学录像:光盘\TM\lx\3\设置段落格式.exe
文字属性的设定我们已经做了介绍,文字的组合就是段落,在文本编辑窗口中,输入完一段文字后,按下Enter键就生成了一个段落。在HTML中可以通过标记实现段落的效果,下面具体介绍和段落相关的一些标记。
3.3.1 段落标记——p
在HTML语言中,段落通过<p>标记来表示。
语法
<p>段落文字</p>
语法解释
可以使用成对的<p>标记来包含段落,也可以使用单独的<p>标记来划分段落。
【例3.11】实例代码。(实例位置:光盘\TM\sl\3\11)
<html> <head> <title>输入段落文字</title> </head> <body> <p>张而不弛,文武弗能也;</p> 弛而不张,文武弗为也,一张一弛,文武之道也。<p> </body> </html>
运行这段代码,可以看到两种方法的段落标记都可以成功地将文字分段。效果如图3.11所示。
图3.11 段落效果
3.3.2 取消文字换行标记——nobr
如果浏览器中单行文字的宽度过长,浏览器会自动将该文字换行显示,如果希望强制浏览器不换行显示,可以使用相应的标记。
语法
<nobr>不换行显示的文字</nobr>
语法解释
标记之间的文字在显示的过程中不会自动换行。
【例3.12】实例代码。(实例位置:光盘\TM\sl\3\12)
<html> <head> <title>文字不换行显示</title> </head> <body> <!--当浏览器宽度不够时,文本内容会自动换行显示--> World Wide Web(万维网WWW)是一种建立在Internrt上的、全球性的、交互的、多平台的、分布式的信息资 源网络。它采用HTML语言描述超文本(Hypertext)文件。这里所说的超文本指的是包含有链接关系的文件,并 且包含了多媒体对象的文件。<p> <!--下面这段文字不会自动换显示,当浏览器宽度不够时,会出现滚动条--> <p><nobr>World Wide Web(万维网WWW)是一种建立在Internrt上的、全球性的、交互的、多平台的、分布 式的信息资源网络。它采用HTML语言描述超文本(Hypertext)文件。这里所说的超文本指的是包含有链接关系 的文件,并且包含了多媒体对象的文件。</nobr></p> </body> </html>
运行这段代码,可以看到强制文字不换行的效果,如图3.12所示。
图3.12 文字不换行的效果
3.3.3 换行标记——br
段落与段落之间是隔行换行的,文字的行间距过大,这时可以使用换行标记来完成文字的紧凑换行显示。
语法
<br>
语法解释
一个<br>标记代表一个换行,连续的多个标记可以多次换行。
【例3.13】实例代码。(实例位置:光盘\TM\sl\3\13)
<html> <head> <title>文字的换行</title> </head> <body> 龚自珍<br/><br/> 九州生气恃风雷,万马齐喑究可哀。<br/> 我劝天公重抖擞,不拘一格降人才。<br/> </body> </html>
图3.13 文字的换行
运行这段代码,可以看到使用换行标记的效果,如图3.13所示。
3.3.4 保留原始排版方式标记——pre
在网页创作中,一般是通过各种标记对文字进行排版的。但是在实际应用中,往往需要一些特殊的排版效果,这样使用标记控制起来会比较麻烦。解决的方法就是保留文本格式的排版效果,例如空格、制表符等。如果要保留原始的文本排版效果,则需要使用<pre>标记。
【例3.14】实例代码。(实例位置:光盘\TM\sl\3\14)
<html> <head> <title>保留原始排版方式</title> </head> <body> <p>下面是原始文字的排版效果</p> <pre> m mm rrrrrrrr mmmm mm mm rrr rrr mm mm mm mm rrr rrr mm mm mm mm rrr rrr mm mm mm mm rrr rrr mm mmm mm rrr rrrr </pre> </body> </html>
运行这段代码,可以看到运行效果和文本中的效果相同,如图3.14所示。
图3.14 保留原始的排版效果
3.3.5 居中对齐标记——center
对于段落来说,和普通文字类似,有时候也需要将段落居中。在HTML语言中提供了专门的标记。
语法
<center>文字</center>
语法解释
在标记之间的文字会自动居中显示。
【例3.15】实例代码。(实例位置:光盘\TM\sl\3\15)
<html> <head> <title>文字的居中对齐</title> </head> <body> <center> <p>汉乐府《长歌行》</p> 百川东到海,何时复西归?<br/> 少壮不努力,老大徒伤悲。 </center> </body> </html>
运行这段代码,可以看到这首古诗居中显示,如图3.15所示。
图3.15 段落的居中显示
3.3.6 向右缩进标记——blockquote
使用<blockquote>标记可以实现页面文字的段落缩进。这一标记也是每使用一次,段落就缩进一次,可以嵌套使用,以达到不同的缩进效果。
语法
<blockquote>文字</blockquote>
语法解释
在该标记之间的文字会自动缩进。
【例3.16】实例代码。(实例位置:光盘\TM\sl\3\16)
<html> <head> <title>段落的缩进效果</title> </head> <body> 《荀子》 <blockquote>不登高山</blockquote> <blockquote><blockquote>不知天之高也</blockquote></blockquote> <blockquote><blockquote><blockquote>不临深溪</blockquote></blockquote></blockquote> <blockquote><blockquote><blockquote><blockquote> 不知地之厚也</blockquote></blockquote></blockquote></blockquote> </body> </html>
在上面的代码中,多次嵌套使用了<blockquote>标记,运行这段代码的效果如图3.16所示。
图3.16 段落的缩进效果