- JSP通用范例开发金典
- 赵丽 王树森编著
- 1341字
- 2020-08-26 19:10:17
1.2 文字
范例1-6 正文标题
实例位置:光盘\ch01\1-6
范例说明 About the Example
本范例介绍网页中如何定义正文标题。程序运行效果如图1-6所示。
图1-6 正文标题运行效果图
语法说明 About the Expression
<hn></hn>标记——正文标题。
语法形式:<hn align = #>显示内容</hn>
align属性——设置水平对齐方式。
# = left(左对齐)、center(居中)、right(右对齐)。
HTML使用<h1>到<h6>这几个标记来定义正文标题,从大到小。这些标记会自动插入一个空行,不必使用 <p> 标记再加空行。因此在一行中无法使用不同大小的字体。
关键步骤 Key Steps
1.打开Eclipse。
2.在ch01工程中的Webcontent目录下新建一个EX006目录,然后在此目录下新建一个HTML页面,命名文件名为EX1-6.html,输入代码。
3.打开浏览器,输入http://127.0.0.1:8080/ch01/EX006/EX1-6.html,即可显示如图1-6所示的内容。
程序代码 Codes
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB18030"> <title>JSP通用范例大全</title> </head> <body> <h1>一级标题</h1> <h2>二级标题</h2> <h3>三级标题</h3> <h4>四级标题</h4> <h5>五级标题</h5> <h6>六级标题</h6> <h3 align=left>三级标题左对齐</h3> <h3 align=center>三级标题居中</h3> <h3 align=right>三级标题右对齐</h3> </body> </html>
范例1-7 文字格式
实例位置:光盘\ch01\1-7
范例说明 About the Example
本范例介绍在网页中用font这个元素及其属性来设定字体的大小、颜色和字体风格。程序运行效果如图1-7所示。
图1-7 文字格式的运行效果图
语法说明About the Expression
<font></font>标记——文字格式。
语法形式:<font size = "#1" color = "#2" face = "#3">显示内容</font>
● size属性——设置字体的大小。
#1 = 数字(有1-7号字体大小,默认为3号字体)或者以默认字体增加、减少字体大小级数(如:+1、-2)。
● color属性——设置字体颜色。
#2 = rrggbb。
● face属性——设置字体风格。
#3 =客户端可获得的字体,如Arial、宋体、黑体等,只有客户端安装有该种字体样式才起作用。
关键步骤 Key Steps
1.打开Eclipse。
2.在ch01工程中的Webcontent目录下新建一个EX007目录,然后在此目录下新建一个HTML页面,命名其文件名为EX1-7.html,输入代码。
3.打开浏览器,输入http://127.0.0.1:8080/ch01/EX007/EX1-7.html,即可显示如图1-7所示的内容。
程序代码 Codes
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB18030"> <title>JSP通用范例大全</title> </head> <body> <p><font size =1 color=red>JSP通用范例大全</font></p> <p><font size =2>JSP通用范例大全</font></p> <p><font size =3>JSP通用范例大全</font></p> <p><font size =4>JSP通用范例大全</font></p> <p><font size =5>JSP通用范例大全</font></p> <p><font size =10 face="隶书">JSP通用范例大全</font></p> </body> </html>
范例1-8 物理字体与逻辑字体
实例位置:光盘\ch01\1-8
范例说明 About the Example
本范例介绍在网页中根据各种情况来调整字体效果。程序运行效果如图1-8所示。
图1-8 物理字体与逻辑字体的运行效果图
语法说明 About the Expression
1.物理字体语法形式
● <b></b>标记——显示粗体。
● <i></i>标记——显示斜体字。
● <u></u>标记——显示下划线。
● <tt></tt>标记——显示打印机体。
● <sub><sub/>——显示上标。
● <sup></sup>——显示下标。
● <s></s>标记或<strike></strike>标记——显示删除线。
2.逻辑字体语法形式
● <em></em>标记——用于强调。
● <strong></strong>标记——用于加强语气。
● <code></code>标记——用于显示原始代码。
● <samp> </samp>标记——用于引用文字。
● <kbd></kbd>标记——用于表示使用者输入的文字。
● <var></var>标记——用于显示变量。
● <dfn></dfn>标记——用于定义。
● <cite></cite>标记——用于引经据典的文字。
● <small></small>标记——小字号标记。
● <big></big>标记——大字号标记。
关键步骤 Key Steps
1.打开Eclipse。
2.在ch01工程中的Webcontent目录下新建一个EX008目录,然后在此目录下新建一个HTML页面,命名其文件名为EX1-8.html,输入代码。
3.打开浏览器,输入http://127.0.0.1:8080/ch01/EX008/EX1-8.html,即可显示如图1-8所示的内容。
程序代码 Codes
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB18030"> <title>JSP通用范例大全</title> </head> <body> <p><b>物理字体</b> 物理字体</p> <p><i>物理字体</i> 物理字体</p> <p><u>物理字体</u> 物理字体</p> <p><tt>物理字体</tt> 物理字体</p> <p><sup>物理字体</sup> 物理字体</p> <p><sub>物理字体</sub> 物理字体</p> <p><s>物理字体</s> 物理字体</p> <p><strike>物理字体</strike> 物理字体</p> <p><em>逻辑字体</em> 逻辑字体</p> <p><strong>逻辑字体</strong> 逻辑字体</p> <p><code>逻辑字体</code> 逻辑字体</p> <p><samp>逻辑字体</samp> 逻辑字体</p> <p><kbd>逻辑字体</kbd> 逻辑字体</p> <p><var>逻辑字体</var> 逻辑字体</p> <p><dfn>逻辑字体</dfn> 逻辑字体</p> <p><cite>逻辑字体</cite> 逻辑字体</p> <p><small>逻辑字体</small> 逻辑字体</p> <p><big>逻辑字体</big> 逻辑字体</p> </body> </html>
提示:
在通常情况下,HTML会自动截去多余的空格。不管加多少空格,都会被看做一个空格。比如在两个字之间加了10个空格,HTML会自动截去9个空格,只保留一个。为了能在网页中增加空格可以使用“ ”表示空格。