《html网页设计文字与段落》由会员分享，可在线阅读，更多相关《html网页设计文字与段落（74页珍藏版）》请在金锄头文库上搜索。
1、第3章 文字与段落清华大学出版社主要内容 对网页中的文字格式化 对网页中的段落格式化3.1.1添加文字l文字是网页的基础部分，可以通过一些HTML标记实现对 文字的格式化。在HTML文件中，添加文字内容的方式与 在word、记事本等中添加文字的方式相同，在需要输入 文字的地方输入即可，但是需要添加在与 标记之间。具体内容包括浏览器中要显示的文 字、空格符、特殊符号以及注释语句。3.1.1添加文字在网页中添加文字这是一本介绍HTML，CSS，JAVASCRIPT的专业书籍。3.1.1添加文字3.1.2标题字l标题字，就是以几种固定的字号去显示文字。在HTML中 ，定义了六级标题，从一级到六级，每
2、级标题的字体大小 依次递减。基本语法： 标题文字3.1.2标题字在网页中添加标题字一级标题 二级标题 三级标题 四级标题 五级标题 六级标题3.1.2标题字3.1.3添加空格l通常情况下，HTML会自动删除文字内容中的多余空格， 不管文字中有多少空格，都被视做一个空格。比如：两个 字之间加了10个空格，HTML会截去9个空格，只保留一 个。为了在网页中增加空格，可以明确使用“”表 示空格。这种使用代码控制的方式与在文本编辑软件中通 过输入空格键来添加空格的方式不同。基本语法：3.1.3添加空格在网页中添加空格这是一本介绍HTML，CSS， JAVASCRIPT的专业书籍。3.1.3添加空格3.
3、1.4添加特殊符号l特殊符号和空格一样，也是通过在HTML文件中输入符号 代码来添加。使用特殊符号可以将键盘上没有的字符输出 出来。基本语法：3.1.4添加特殊符号在网页中添加特殊符号版权所有 3.1.4添加特殊符号3.1.5注释语句l可以在HTML文档中添加注释，增加代码的可读性，便于 以后维护和修改。访问者在浏览器中是看不见这些注释的 ，只有在用文本编辑器打开文档源代码时才可见。基本语法：或3.1.5注释语句l l ll在网页中添加添加注释 l lbody标记是主体内容 l ll我们永远的家 l多媒体专业！ l l l l 3.1.5注释语句3.2文字样式l在网页中添加文字后，可以设置其字
4、体、字号、颜色等属 性，利用标记或标记都可以实现。3.2.1普通文字标记l利用可以对网页文字的字体、字号、颜色 进行定义。基本语法：3.2.1普通文字标记设置文字的字体、字号、颜色我们是一个团体， 不会丢下谁，不会落下谁。共同奋进！ 3.2.1普通文字标记3.2.2基底文字标记l在制作网页前，可以先使用标记对整个网页 文字进行一个基本的定义，主要包括字体、字号和颜色， 当网页中没有另外定义文字样式时，就自动套用 定义的样式，定义将影响整个HTML页面。基本语法：3.2.2基底文字标记01： 02： 03： 04： 整个网页文字的字体、字号和颜色基本 定义 05： 06： 07： 08： 09：
5、 学校将于近期举办校园卡拉OK大赛 10： 11： 学校将于近期举办校园卡拉OK大赛 12： 3.2.2基底文字标记13： 14： 15： 学校将于近期举办校园卡拉OK大赛 16： 17： 18： 19： 3.2.2基底文字标记3.3.1粗体、斜体、下划线l 基本语法：3.3.1粗体、斜体、下划线文字的加粗、斜体和下划线这些文字是粗体 的 这些文字是斜体的 这些文字带有下划线3.3.1粗体、斜体、下划线3.3.2删除线l基本语法：3.3.2删除线给文字添加删除线作者信箱由更改 为 3.3.2删除线图3-9给文字添加删除线3.3.3上标、下标l在数学公式中，上标和下标的使用比较广泛，比如x1，
6、x2，y1，y2等。基本语法：3.3.3上标、下标上标、下标的实现解下面的代数方程式 x2-3x+2=0 解：x1=2; x2=13.3.3上标、下标3.3.4设置文字标注l在HTML文件中，可以在文字上方添加说明，并以缩小的 字号显示。基本语法：被说明文字文字的标注3.3.4设置文字标注在文字上方标注说明第二十九届奥运会在北京举行20083.3.4设置文字标注3.3.5设置地址文字l标记用来表示HTML文档的特定信息，如：E -mail、地址、签名、作者、文档信息等。基本语法：3.3.5设置地址文字设置地址文字给我们写信:3.3.5设置地址文字3.3.6设置等宽文字l为了使网页中的文字显示更
7、加整齐、美观，可以使用以下 标记进行设置。基本语法：3.3.6设置等宽文字01： 02： 03： 04： 设置等宽文字 05： 06： 07： 成功源于努力去克服困难 08： Success grows out of struggles toovercome difficulties.3.3.6设置等宽文字09： Success grows out of struggles to overcome difficulties. 10： Success grows out of struggles to overcome difficulties. 11： Success grows out of
8、 struggles to overcome difficulties. 12： 13： 3.3.6设置等宽文字3.4段落l文字的组合就是段落，段落就是格式上统一的文本。下面 介绍和段落相关的HTML标记。3.4.1段落标记l在文本编辑器中输入的回车和额外空格将被HTML忽略， 所以要在网页中开始一个段落需要通过使用标记来实 现。由标记所标识的文字，代表同一个段落的文字。 不同段落间的间距等于连续加了两个换行符，用以区别文 字的不同段落。基本语法：3.4.1段落标记段落五十个不同的分子，在不同状态下进入了同一容器， 这就组成了我们的家多媒体专业。在这个容器里， 我们碰撞着，摩擦着，产生了各色各
9、样的灵感，活力与 情绪。3.4.1段落标记在不地碰撞和摩擦中，分子也不断地变化，成长着， 最终可走出这个容器，勇敢地面对、挑战外面的世界。 不管外面如何复杂、艰难，请大家彼此珍惜这段我们相逢 相识相知的日子，在这里我们痛过笑过哭过，不论是苦的 还是甜的，这都是我们年轻的见证。3.4.1段落标记3.4.2换行标记l可以使用来控制段落中文字的换行显示。一般，浏 览器会根据窗口的宽度自动将文本进行换行显示，如果想 强制浏览器不换行显示，可以使用标记。若希望 在标记中的文字强制换行，则可以使用 。基本语法：3.4.2换行标记01： 02： 03： 04： 换行 05： 06： 07： 08：无换行标记
10、：在这个容器里，我们碰撞着，摩擦着，产生了各色各样的灵感，活力与情绪。 09：有换行标记：在这个容器里， 10：我们碰撞着，摩擦着，产生了各色各样的灵感，活力与情绪。 11： 12：五十个不同的分子，在不同状态下进入了同一容器，这就组成了我们的家 13：媒体专业。在这个容器里，我们碰撞着，摩擦着，产生了各色各样的灵感，活 14：与情绪。 15： 16： 3.4.2换行标记3.4.3居中标记l如果希望网页中的段落居中显示，可以采用标记 。该标记也可以使图片等网页元素居中显示。基本语法：3.4.3居中标记居中对齐标记关于我们 五十个不同的分子，在不同状态下进入了同一容器，这就组 成了我们的家多媒体
11、专业。3.4.3居中标记3.4.4水平分隔线l水平线可以作为段落与段落之间的分隔线，使得文档结构 清晰，层次分明。基本语法：3.4.4水平分隔线01： 02： 03： 04： 水平分隔线 05： 06： 07： 08：关于我们 09： 10：五十个不同的分子， 11： 12：在不同状态下进入了同一容器， 13：3.4.4水平分隔线14：这就组成了我们的家多媒体专业。 15： 16：在这个容器里，我们碰撞着，摩擦着，产生了各色各样的灵感，活力与情绪。 17： 18： 19： 20： 3.4.4水平分隔线3.4.5预格式化标记l浏览器在显示HTML页面时候，通常会将页面中所有的额 外空白和回车进行
12、压缩，并根据窗口宽度自动换行。要想 保留原始文字排版的格式，可以通过标记来实现。基本语法：3.4.5预格式化标记01： 02： 03： 04： 原样显示文字标记 05： 06： 07： 08： 请记住我们是一个团体， 09： 10： 不会丢下谁， 11： 12： 不会落下谁。 13： 14： 共同奋进！ 15： 16： 17： 3.4.5预格式化标记3.4.6忽略html标记l在HTML文件中，利用标记，可以使得该标记后 面的HTML标记的作用被忽略，直接显示在页面中。基本语法：3.4.6忽略html标记忽略HTML标记基本语法：内容作用：设置显示字号。示例：这是h3标记的例子3.4.6忽略h
13、tml标记3.4.7设置段落缩进l利用段落的缩进，可以增加段落的层次效果。基本语法：3.4.7设置段落缩进01： 02： 03： 04：段落缩进 05： 06： 07： 关于我们 08： 09： 五十个不同的分子，在不同状态下进入了同一容器， 10： 11： 12： 这就组成了我们的家083007班。 13： 14： 15： 16：3.4.7设置段落缩进3.5小实例l本节给出一个唐诗欣赏的页面，在这个实例中综合运用本 章所介绍的标记对普通文字进行格式化。 3.5小实例文字网页唐诗欣赏静夜思 李白床前明月光，疑是地上霜。 举头望明月，低头思故乡。【简析】3.5小实例这是写远客思乡之情的诗，诗以明
14、白 如话的语言雕琢出明静醉人的秋夜的意境。它不追求想象的新颖奇特，也 摒弃了辞藻的精工华美；它以清新朴素的笔触，抒写了丰富深曲的 内容。境是境，情是情，那么逼真，那么动人，百读不厌，耐人寻绎。 无怪乎有人赞它是“妙绝古今”。版权:版权所有，违者必究 E-mail:3.5小实例小结本章介绍了文字与段落的格式设置。主要内容包括文字内 容标记、文字样式标记、文字修饰标记、段落修饰标记的使用。 1. 在浏览器显示的文字内容编写在和标 记之间，内容包括普通的文字、空格符号和特殊符号以及页面的注释语句，标题字标记在HTML中，定义了六级标题； 2. 文字修饰标记可实现网页文字的斜体、加粗、上标、下标 、大小字号、下划线、删除线、等宽、地址等设置； 3. 段落格式设置可实现段落对齐方式、换行、预格式化、水平线设置、换行等设置。
