延安大学：《网页制作基础教程》课程PPT教学课件_第三章 格式化

网页制作基础教程 牛永洁 延安大学计算机学院

网页制作基础教程 延安大学计算机学院 牛永洁

内容提要 令本节主要学习如何控制网页中文本的格式 掌握文本设置方法 豪掌握段落的设置方法 掌握滚动效果设置方法 ※掌握水平线的使用方法

内容提要 ❖本节主要学习如何控制网页中文本的格式 掌握文本设置方法 掌握段落的设置方法 掌握滚动效果设置方法 掌握水平线的使用方法

设置文字格式 令在一个网页中,大部分的内容仍然是文字, 再配上适当的图片,所以掌握如何控制文 字的效果,显得比较重要。 ◆本节就从一篇文章出发,使用各种方法逐 渐美化我们的网页 ◆首先来看一个比较粗糙的关于“清朝人物 简历”的网页

设置文字格式 ❖在一个网页中，大部分的内容仍然是文字， 再配上适当的图片，所以掌握如何控制文 字的效果，显得比较重要。 ❖本节就从一篇文章出发，使用各种方法逐 渐美化我们的网页。 ❖首先来看一个比较粗糙的关于“清朝人物 简历”的网页

增加背景以及左边距一 令背景图片 background 左边距:| eftmargin ◆添加文章标题 在HTML中有6中标题 豪标题使用 .. .. . .. . .

增加背景以及左边距 ❖背景图片:background ❖左边距：leftmargin ❖添加文章标题 在HTML中有6中标题 标题使用 ➢… ➢… ➢… ➢… ➢… ➢… ➢…

设置字体信息 ◇设置字体信息. ◇设置文字的颜色.. ◇设置文字的字体. 令设置文字的大小.. 属性 说明 绝对数值 1-7 相对数值 从-4到+4,相对于3号 的放大与缩小

设置字体信息 ❖设置字体信息… ❖设置文字的颜色… ❖设置文字的字体… ❖设置文字的大小… 属性 说明 绝对数值 1-7 相对数值 从-4到+4，相对于3号 的放大与缩小

文字的修饰 令加大字体:包含的文字将比 普通字体大一级,如果使用多个标记,将 多次加大字号。 ◆缩小字体标记,只是将字号变小 令、加粗字体 ◆<>、、将字体倾斜 、给文字添加下划线, 给文字添加删除线

文字的修饰 ❖加大字体…：包含的文字将比 普通字体大一级，如果使用多个标记，将 多次加大字号。 ❖缩小字体…：作用同 标记，只是将字号变小。 ❖、加粗字体 ❖、、将字体倾斜 ❖、给文字添加下划线，、 给文字添加删除线

文字的修饰 令上标 ◆下标 令设置等宽字体、常用于英 文 ◆换行标记 令不换行标记

文字的修饰 ❖上标 ❖下标 ❖设置等宽字体、常用于英 文. ❖换行标记 ❖不换行标记

段落的操作 ☆段落的标记 0>. 令段落的文字对齐属性 p align=“对齐方式”>… 属性值 说明 left 左对齐 center 居中对齐 right 右对齐 us tify 两端对齐

段落的操作 ❖段落的标记… ❖段落的文字对齐属性… 属性值 说明 left 左对齐 center 居中对齐 right 右对齐 justify 两端对齐

设置文字的方向 令用来设置文字的方向 条方向从左到右tr 方向从右到左rt bdo的来历: bidirectional双向的简写

设置文字的方向 ❖用来设置文字的方向 ❖ 方向从左到右ltr 方向从右到左rtl ❖bdo的来历：bidirectional 双向的简写

水平线的使用 ◆在网页中显示一条水平线 令水平线的属性 ※wdth:设置水平线宽度 睾sze:设置水平线高度 ※ color:设置水平线颜色 亲 align:设置水平线的对齐方式 ※ noshade:设置是否有阴影

水平线的使用 ❖在网页中显示一条水平线: ❖水平线的属性： width：设置水平线宽度 size：设置水平线高度 color：设置水平线颜色 align：设置水平线的对齐方式 noshade：设置是否有阴影