网页基础.ppt

《网页基础.ppt》由会员分享，可在线阅读，更多相关《网页基础.ppt（31页珍藏版）》请在三一办公上搜索。

1、HTML语言与网页设计,文本与段落,学习目标,掌握FONT标记符的用法，理解物理字符样式和逻辑字符样式。掌握P、BR、Hn、HR标记符的用法，掌握设置段落对齐的方法。掌握有序列表、无序列表和嵌套列表的构造方法。掌握设置网页背景颜色或图像及背景声音的用法。,Part 1,设置字符格式,字符格式,所谓字符格式是指针对段落中的部分文字（一个或一组文字，也可以是整个段落的文字）所设置的格式，通常包括字体、字号、文字颜色等。,FONT标记符,FONT标记符具有3个常用的属性：SIZE 设置字体大小COLOR 设置字体颜色FACE 设置字体样式,FONT标记符,字号属性 size 的值可以从1到7，3是默

2、认值。该属性值也可以用+号或-号来作为相对值指定。SHOPPING BASKET,FONT标记符,字体标记符的 color 属性可用来控制文字的颜色，它的使用方法与正文标记符BODY中使用的 bgcolor 属性相同。,演示,FONT 标记符的 size 属性示例正常文本 这些是大字体的文本 这些是小字体的文本 这些文字的字体比正常文本大 2 号这些文字的字体比正常文本小 2 号混合字体大小 这些是红色的文本,FONT标记符,Face 属性用来指定字体样式。在编制网页时，通过在FONT标记符中指定 face 属性，用户可以指定一个或几个字体名称（用逗号隔开）。,演示,以下是常用中文字体：宋体

3、楷体 黑体 隶书 幼圆 以下是常用英文字体：Times New Roman Arial Arial Black Courtier New Comic Sans MS Verdana,常用物理字符样式,物理字符样式是指标记符本身说明了所修饰的效果。常用物理字符样式标记符有：黑体标记斜体标记下划线标记等。,演示物理字符样式效果,此处为粗体显示文本 此处为大字体文本 此处为小字体文本 此处为斜体文本 此处为等宽字体文本 此处为下划线文本 此处为使用标记设置的删除线文本 此处为上标示例：x2+y2=R2 此处为下标示例：H2SO4,Part 2,设置段落格式,段落格式,所谓段落格式是指针对 HTML

4、文档中的段落所设置的格式，例如，段落的对齐方式。,分段标记符,分段标记符用于将文档划分为段落，标记为，其中结束标记符通常可省略。换行标记符用于在文档中强制断行，标记为一个单独的。该标记符与分段标记符是有区别的。,演示P与BR,第一段 第二段，用标记符可以产生多个空行效果 此为最后一段,标题样式,在 HTML 中，用户可以通过 Hn 标记符来标识文档中的标题和副标题，其中 n 是1至6的数字；H1表示最大的标题，H6表示最小的标题。使用标题样式时，必须使用结束标记符。,演示标题效果,此为一级标题 此为二级标题 此为三级标题 此为四级标题 此为五级标题 此为六级标题 此为正常文本,添加水平线,添加

5、水平线的标记符为HR，它包括以下属性：SIZE 属性用来改变水平线的粗细。WIDTH 属性用来更改水平线的长度。NOSHADE 属性使水平线以实线显示。COLOR属性可以控制水平线的颜色。,演示水平线效果,以下是默认水平线：以下是粗为 5 像素的水平线：以下是长度为100像素的水平线：以下是长度为屏幕宽度 50%的水平线：以下是粗为 5 像素的实心水平线：以下是红色的水平线：,ALIGN 属性,ALIGN 属性用于设置段落的对齐格式，其值包括：RIGHT（右对齐）、LEFT（左对齐）、CENTER（居中对齐）和 JUSTIFY（两端对齐）。ALIGN 属性可应用于多种标记符，最典型的是应用于

6、P、Hn（标题标记符）、HR 等。,演示段落对齐,本行为默认对齐的段落，相当于 align=left 本行为居中对齐的段落 本行为右对齐的段落 本行为居中对齐的一级标题 以下为左对齐的水平线：,DIV 标记符,DIV 标记符用于为文档分节，以便为文档的不同部分应用不同的段落格式，其标记为。位于 DIV 标记符中的多段文本将被认为是一个节，可为它们设置一致的对齐格式。,CENTER 标记符,如果用户要将文档内容居中，还可使用 CENTER 标记符，方法为：将需居中的内容置于和之间。,演示DIV与CENTER,浣溪沙 晏殊 一曲新词酒一杯，去年天气旧池台，夕阳西下几时回？无可奈何花落去，似曾相识燕归来，小园香径独徘徊。,Part 3,背景颜色、图片和背景声音,背景颜色,在标记符中使用BGCOLOR属性可以为网页设置背景颜色。在 HTML 中，除了使用颜色名称以外，还可以用格式#RRGGBB 来表示颜色。,背景图案,使用 BODY 标记符的 BACKGROUND 属性可以设置背景图案。HTML语句为：,背景声音,在HEAD中添加：,Part 4,图片的初步使用,背景图案,使用 img 标记符的 src 属性可以设置在网页中显示图片。HTML语句为：,