网页制作基础知识-习题.ppt

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

1、第一章 网页制作基础知识,网页是构成网站的基本元素，也是网站信息发布的一种最常见的表现形式。网页主要由文字、图片、动画、音频、视频等信息组成。HTML超文本标记语言是网页制作的基础，在美化网页的过程中，CSS级联样式表可以方便、快捷的控制网页总体风格。教学目标 通过本章的学习，了解HTML在网页制作中的重要作用和意义，掌握一些主要标记的含义、用法及属性设置。能够灵活的配合CSS有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。教学重点与难点 HTML文档的组成和基本标记的作用、属性设置。利用HTML标记创建网页中的基本元素。CSS规则和内、外部CSS的用法。利用CSS文件对网页

2、的总体风格进行控制。通过修改HTML文档中代码的方法编辑并变化网页。,1.1 案例 网页制作学习园地网页,网页主要由HTML语言中起着各种作用的标记和对网页风格起控制作用的CSS样式表编写而成，本章将介绍“网页制作学习园地”网站的制作。“网页制作学习园地”主页“index.htm”，网页效果如下所示。,1.1案例：网页制作学习园地网页,点击网页中的超链接“第一章 网页制作基础知识”字样，在新窗口中打开一个框架网页“Frameset.htm”，点击“HTML主要标记”，在主框架中打开相关网页。网页效果如下所示。,1.1.1 功能要求1整个网站主要以HTML代码编写的方式完成。页面风格以简单、清晰

3、为 主，网页基本元素由文本和图像组成；2在主页中，访问者可以获得网站中的主题信息和学习内容列表。点击链 接文本，可以打开介绍相关知识点的页面；3在页面中设置电子邮件链接，如“联系我们”，提供一个与用户互交的平台；4为网页设置背景音乐和欢迎字幕。打开网页，有声音传出。当鼠标指针移动到滚动的欢迎字幕上时，文字停止滚动，移下鼠标后继续；5点击页面中的链接字，在新的浏览器窗口打开一个由上框架、左框架和主框架构成的框架网页。1.1.2 详细设计网页设计的步骤如下：1网页总体规划 首先考虑和设计网页的框架结构和艺术风格。可以先画出网站的草图，确定网站中各网页之间的链接关系，这样在创建每个网页时都会有清晰的

4、思路，以免迷失方向，而且以后需要进行重组的可能性较小。,“网页制作学习园地”网站的链接结构如下图：在本地计算机的硬盘中建一个名为“mysite”的文件夹（此文件夹为空）做为站点，即网站根目录。在制作的过程中将所有创建和编辑的文档，以及用到的网页素材都保存在该文件夹中。本案例中共需要创建三个网页，“index.htm”为网站首页，单击页面中的超链接：“第一章 网页制作基础知识”，在新的浏览器窗口中打开一个框架网页，此框架网页的文件名为“Frameset.htm”。框架网页中包括上框架（链接网页是topframe.htm）、左框架（链接网页是leftframe.htm）和主框架（链接网页是main

5、frame.htm）。单击左框架中的超链接：“HTML主要标记”，在主框架中打开介绍HTML文档结构标记的网页“html_tag.htm”。,在组织站点结构时，应注意以下几个问题：归类站点资源 在同一个文件夹中放置相关的网页，并在需要的时候使用子文件夹。这样的组织方式可以使网站层次清晰，更容易更新、维护。确定网页素材存放的位置 站点中通常包含图像、声音、动画等多种素材，为了更好的存储资源，一般应在站点根目录下创建多个子文件夹，将用到的网页素材分门别类地存储到相应的文件夹下。必要时，可以创建多级子文件夹。本案例中将站点命名为“mysite”，根据网站的实际需要，其中建立了“HTML”、“imag

6、e”、“sound”、“style”四个文件夹，分别用来放置网页、图像、声音和样式表文件。网页及网页元素的命名 为页面、图像和其他外部文件设计一个简单且一致的命名系统。根据一般原则，主页命名为“index.htm”，其他页面及相关的网页元素能望名知意。很多Internet服务器使用的是英文操作系统，不能对中文文件名提供很好的支持，故在构建的站点中，建议全部使用英文字母组成文件名。,2网页的主题定位 确定为什么要创建这个网页及希望展示的内容。创建此页面的目的是让访问者一打开网页就能发掘学习的内容，同时显示友好的标语欢迎访问者。3图片、声音等媒体文件的使用 要让网页更加美观，更具人性化，可在网页中

7、适当添加图片、动画、音/视频等多媒体文件。为了保证网页的传输速度，选择网络上常见的媒体格式，并将它们放置在相应的文件夹中。4制作工具的选择 可使用FrontPage、DreamWeaver等网页制作软件。在本案例中，将使用DreamWeaver MX进行“网页制作学习园地”网站的创建。,1.2 理论知识,1.2.1 HTML语言 在Web的发展历史中，HTML技术是优秀而核心的Web技术之一。目前计算机上包含互联网在内的大部分应用程序在交互操作上的核心原理都来自于HTML的链接设计思想。1、HTML简述 HTML（HyperText Markup Language）即超文本标记语言，是WWW描

8、述语言及制作网页的基础，也是一种用于文档布局和超文本链接规范的语言。它定义了特殊的、嵌入式指令的语法和放置方法，浏览器中不会显示这些指令，但是可以告诉浏览器该如何显示文档的内容，如文本、图像以及其他支持的媒体等。HTML基于SGML，即标准通用标记语言（Standard Generalized Markup Language）。由HTML标记（或标签、标记）组成的描述性文本，可说明文字、图形、动画、声音、表格、链接等内容。,2HTML标记的表示,HTML标记的格式：文件内容 HTML标记必须写在一对尖括号“”中，通常情况下成对出现。结束标记在标记前添加斜杠“/”。根据HTML标准，标记和属性名

9、不区分大小写。如、之间没有任何区别，它们的作用都是一样的。标记可包含自身的一个或多个属性，标记与属性之间以空格隔开。各属性的排列顺序不做要求，属性值可由用户设置，否则将采用默认的设置值，属性值要用双引号或单引号括起来。其格式如下：,HTML结构包括头部（Head）、主体（Body）两大部分。头部放置文档标题，也可以指明浏览器在显示文档时可能会用到的其他参数；主体放置文档的实际内容，包括要显示的文本和文档的控制标记（标签），这些标记将告诉浏览器该如何显示文本。标签还可以引用特殊效果的文件，包括图像、图形、声音和动画，并指出将文档链接到其他文档的热点。,3HTML文档结构,1.2.1.1 HTML

10、文档结构标记,1HTML文档结构标记及作用如下表所示。,标记,例：指明文档类型为文本类型，网页内容用标准简体中文显示，代码如下：代码解释：content:提供页面内容的相关信息 charset:字符集。提供网页的编码信息，浏览器根据这行代码选择正确的语言编码。,标记的常用属性如下表：,meta HTTP-EQUIV=“content-type”CONTENT=“text/html;charset=GB2312”,标记,标记的常用属性如下表：,1.2.1.2 文本标记,1文字标记标记用于设置网页中文字的字号、字体、颜色等属性。标记的常用属性如下表：,2.文本样式标记,文本样式标记用于设置网页中文

11、字格式化为特殊的形式，如加粗、倾斜等。文本样式标记如下表：,3文本分隔标记,HTML不识别Enter键和空格键，在文档中需要定义相应的文本分隔标记。,分隔标记如下表：,4常用块级标记,（1）标记 标记之间的所有文本从常规文本中分离出来，并在左、右两边进行缩进，即块引用拥有自己的页面空间。（2）标记 标记可将同一个段落中的文本格式化为不同的样式。（3）标记 DIV标记可用来为HTML文档内大块的内容提供结构和背景。DIV的起始标签和结束标签之间的所有内容都是用来构成这个块的，其中所包含元素的特性由DIV标记的属性来控制，或是通过使用样式表格式化这个块来进行控制。,5滚动文本标记,滚动文本标记常用

12、属性如下表：,1.2.1.3 图像标记,制作网页时，图像是必不可少的网页元素，在HTML语言中使用标记在网页中插入图像，并运用相应的HTML标记设置图像的显示尺寸和对齐方式等属性。HTML常采用的图像格式有gif、jpg和png等。图像标记的常用属性如下表：,1.2.1.4 超级链接标记.,1相关概念（1）超级链接 超级链接是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页或相同网页中的不同位置，也可以是一个图片、一个电子邮件地址、一个文件、甚至是一个应用程序。当浏览者单击链接后，链接目标将根据打开位置的设置显示在浏览器上。默认情况下，链接文本为蓝色，文字下有一条下划线。当移动鼠标

13、指针到该链接上时，鼠标指针变成一只小手的形状，这时用鼠标左键单击，就可以直接跳到与这个超链接相连接的内容上去。若用户已经浏览过某个超链接，这个超链接的文本颜色会发生改变。（2）URL URL(Uniform Resource Locator)即统一资源定位系统，指出了文件在Internet中的位置，即通常所说的网址。可见，URL在Internet的WWW服务程序上用于指定信息位置的表示方法，服务器可根据它找到网络资源，并传送给客户机。URL可分为绝对地址和相对地址。其中，绝对地址，即一个完整的URL地址，通常由通信协议（如http）、WEB服务器地址、文件在服务器中的路径、文件名四部分组成；相

14、对地址，即相对于同一网站中不同网页之间的链接。,2创建超级链接的基本语法,代码解释：（1）“href”属性：指明被链接文件的路径及文件名。（2）“target”属性：指明显示被链接文本的窗口。target=_blank：将被链接文件在新的浏览器窗口打开。target=“_self”：将被链接文件在当前浏览器窗口打开。3网页中超级链接的使用（1）按照链接路径的不同，网页中的超链接可分为外部链接和内部链接。外部链接 当本网站中的某个链接目标存在于网站之外时使用外部链接。如在网站中设置的友情链接,通常都是站点外部的链接。在外部链接中，URL地址中的路径是绝对路径。内部链接 当本网站中的某个链接目标存

15、在于网站之内时使用内部链接，可用于同一网站中不同网页之间的链接，内部链接可使用相对路径。,（2）按照使用对象的不同，网页中的链接可分为E-mail链接、文本超链接、图像超链、锚点链接等。1）E-mail链接 当点击网页中的E-mail链接后，自动启动outlook express电子邮件收发软件。基本语法：,2）图像超链接,3）热点超链接 图像热点标记.利用标记可在图像文件中创建多个热点区域，即在一张图像上创建多个链接。热点工具的形状可分为矩形（按住“shift”键可绘制出正方形）、椭圆形（按住“shift”键可绘制出圆形）和多边形。,4）锚点链接 锚点链接是指在同一个文档或页面的内部创建超链

16、接，常用于实现阅读中的跳转。创建一个位于文档内部的锚点，语法如下：,其中：“name”属性定义锚点名称。利用“href”属性创建一个指向文档内部锚点的链接，语法如下：,1.2.1.5 列表标记,网页中的列表可分为：“有序列表”、“无序列表”和“定义列表”。1有序列表（.）各项目之间有先后顺序，利用标记.创建列表中的各个项目。有序列表常用属性如下表：,2无序列表（）各项目间无顺序关系，只是用条列式方法显示出来，各项目前均有一符号。利用标记.创建列表中的各个项目。,无序列表常用属性如下表：,1.2.1.5 列表标记,3定义列表 一种既无表项符号，又无项目序号的列表。它由两部分组成，分别称为“定义术

17、语”和“定义内容”。定义列表标记如下表：,1.2.1.6 网页布局,网页布局是指在一个限定的页面范围内，科学、合理的安排文字、图像、图形和动画等网页元素的位置,网页布局是决定网页整体布局结构的主要技术。1创建表格 表格是安排网页布局的一种很常用的技术，可用于组织和显示大量信息和条理性信息，固定文本和图像等网页元素的输出。,（1）表格标记.,标记的常用属性如下表：,（2）表格行标记.,在定义表格的代码中，出现几对.，即代表表格有几行。标记的常用属性如下表：,（3）单元格标记,中的常用属性如下表：,2创建框架网页 框架技术可以将网页分成几个单独的显示区域，就像一个独立的网页，不同的区域可用来载入不

18、同类型的对象。框架集：几个框架的组合。一个框架集是一个HTML文件，用来定义框架结构，即一组框架的布局和属性，如框架的数目、大小和位置等。一个框架对应一个HTML文件，框架集中的每个框架可以显示不同的HTML文件内容。故框架网页是一个HTML集，对于一个有n个区域的框架网页来说，有n+1个HTML文件。在框架网页中被标记取代。,（1）框架集标记.,标记的常用属性如下表：,（2）框架标记,标记的常用属性如下表：,确定目标框架网页的代码如下：,代码解释：“href”属性：设置该框架内链接的具体文件。“target”属性：设置链接目标在框架集网页中的打开目标。常用属性值为：black：点击链接文本后

19、，在一个新的浏览器窗口中打开被链接文件。self：点击链接文本后，被链接文件在链接文本所在的框架中打开。parent：将链接指向父框架网页。若没有父框架网页，则指向自己。父框架、子框架网页是根据网页的结构关系设置的。top：指向整个浏览器窗口本身，网页显示效果如非框架网页中的“self”。,1.2.1.7 创建表单,1表单概述 表单是用来实现网页浏览者与服务器之间信息交互的一种页面元素，是网站管理者与浏览者之间沟通的桥梁，在WWW中被广泛用于各种信息的搜集和反馈。如采集访问者的名字、Email、调查表、留言簿等。（1）HTML源代码用于描述表单（例如：按钮、复选框、下拉菜单等）；（2）脚本或应

20、用程序用于处理提交的信息（如CGI脚本），不使用处理脚本就不能搜集表单数据。表单中包含的数据将被提交到服务器或电子邮件。表单不同于表格、图像等页面元素，它不仅需要使用HTML语言在网页中显示，而且需要服务器端特定程序的支持。,2表单标记.,创建表单的基本语法：,代码解释：（）.称为表单域，是放置表单对象（让用户输入信息的地方）的区域，只有表单域中的表单对象（除了跳转菜单外），才可以将它的信息传送到服务器，或接受外来的信息。（）action=url,指定提交表单的格式，可以是一个URL地址或电子邮件地址。（）method=get/post,指明提交表单的HTTP方法。（）enctype=.,指明

21、用来把表单提交给服务器时(当method值为post)的编码类型。缺省值为“application/x-www-form-urlencoded”。（）TARGET=.,指定提交的结果文档所显示的目标位置。,3标记的常用属性,标记的常用属性如下表：,4创建表单元素标记创建表单元素标记如下表：,代码解释：,在表单中创建一个单行文本框的代码如下：,其中：“name”属性：设置该单行文本框的名称。“value”属性：设置赋给该单行文本框的初始值。,表单中各元素的创建如下表：,1.2.2 级联样式表（CSS）,CSS概述 CSS（Cascading Style Sheets）是级联或层叠样式表的简称，或

22、称为风格样式单（Style Sheet），是万维网协会制定的一种标准。它规定了一系列格式设置规则，是对HTML标记的一种扩展。通过将样式表信息插入到页面中，可以对网页的显示风格进行整体控制。可见，如果一个网站中多个网页的显示风格相同，若逐个页面的进行如网页布局、文本等属性设置，这无疑要做许多重复性的工作。同时也使网页的HTML代码庞大，造成网页传输和下载的速度变慢。为了解决该问题，可以对页面中经常出现的相同或相近属性的对象进行整体属性的设置，即建立样式表。它可以对网页布局、背景、文字、颜色、表格、超链接等属性进行统一的设置，然后再作用到页面的各个相应的对象中去。,CSS的基本特点 CSS语言是

23、一种标记语言,它不需要编译,可以直接由浏览器执行(属于浏览器解释型语言)。CSS的用途主要是帮助页面的HTML源代码和样式表现分离开，这样可使代码结构清晰，提高网页的载入速度。在标准网页设计中，CSS控制网页内容在浏览器中的显示。可通过更改CSS文件，改变网页的整体表现形式。CSS文件是一种文本文件，它包含了一些CSS标记。CSS文件必须使用”.css”为文件扩展名。,CSS的用法,CSS的基本语法：,备注：STYLE元素应插入HTML文档的部分。浏览页面时，只有嵌入了STYLE元素的文档会受到影响。text/css指示了文本CSS样式表类型。,4.CSS在HTML中的引用 可通过使用内联样式

24、表、内嵌样式表和外部样式表的方法将样式表作用到网页中。（1）内联样式表 内联样式表是在网页对象的标记内使用style属性定义适用其的样式表属性，即直接在HTML标记里设置style参数（CSS的属性和属性值）。内联样式表的style属性作用于单个标记，能够对特定标记的显示样式进行精确设定。但因需要对每一种标记进行反复设定，所以网页修改时的工作量较大。（）内嵌样式表 内嵌样式表将样式表文件放置在HTML文档的头部标记之间，利用HTML标记对各种网页元素的样式规则进行定义，具体的属性设置放置在之间。内嵌样式表能够使整个页面的显示风格达到统一，而不需要对单个标记的属性进行重复设置。,（）外部样式表

25、外部样式表是把样式表保存为一个文件扩展名为“.css”的样式表文件，此文件与HTML文档相分离。要使用外部样式表，需将其链接到网页中。调用外部样式表的两种方法：导入外部样式表 调用导入外部CSS的基本语法：,链入外部样式表 调用链入外部CSS的基本语法：,5、CSS选择器,CSS选择器可分为标记选择器、类选择器和ID选择器和特殊选择器。（1）标记选择器 标记选择器仅描述HTML标记，不考虑该标记在文档结构中的位置。（2）类选择器 类选择器必须以英文半角的“.”和选择器名构成。选择器名以字母开头，后可跟数字。class属性用于指定标记属于何种样式的类。（3）ID选择器 ID属性用于定义一个标记的

26、独特样式。一个ID选择符的指定要有指示符#在名字前面，其值必须是以字母开头，后可接数字或连字符。,（4）特殊选择器（CSS伪类）CSS伪类用来指定一个或与其相关的选择符的状态，是CSS已经定义好的，不能像类选择器一样随意定义类名称。最常用的是关于超级链接标记（a）的伪类，可对链接在不同状态下设置不同的样式效果。链接CSS伪类的用法如下表：,7.CSS常用属性（1）字体常用属性如下表：,（2）文本常用属性如下表：,（3）背景常用属性如下表：,（4）CSS盒子模式 CSS盒子模式所具备的属性：内容(content)、填充(padding)、边框(border)、边界(margin)。盒子里由外至里

27、依次是：Margin：即边距，用来设置一个元素所占空间的边缘到相邻元素之间的距离。Border：即边框，用来设置一个网页元素边界线的粗细。Padding：即填充，用来设置元素内容到元素边框之间的距离。Content：即网页内容，如文本，图片等。,边距（Margin）Margin常用属性如下表：,设样式名称为“.style”，边距属性语法：,设置上边距宽度为1cm：,设置上、下、左、右边距的宽度均为1cm：,边框（Border）边框属性包含边框风格（border-style）、边框宽度（border-width）和边框颜色（border-color）。边框风格(border-style)边框风格

28、属性如下表：,边框宽度(border-width)边框宽度属性用来设定上、下、左、右边框的宽度。宽度用长度单位定值，可用绝对长度单位(cm,mm,in,pt)，或用相对长度单位(em,ex,px)。边框宽度属性如下表：,填充（Padding）填充属性设置元素内容到元素边界的距离。填充属性的基本语法：设样式名称为“.style”，上、下、左、右边距的填充值都为1cm。代码如下：,设置不同的宽度值，顺序为上填充为1cm、右填充为2cm，下填充为3cm，左填充为4cm。代码如下：,填充常用属性如下表：,1.3 总结,HTML超文本标记语言已成为各种浏览器的通用标准，并独立于操作系统平台。HTML不是

29、程序语言，它只是一种标记语言，或文本语言。HTML是所有浏览器都能识别的语言，是浏览器生成网页的基础。无论采用哪种技术、哪种语言，最终都以HTML的形式输出。CSS（Cascading Style Sheet）级联样式单主要是用来进行网页风格设计的。通过编写样式表，可以统一地控制HMTL中各标志的显示属性，从而对网页的风格、显示、排版等进行方便、快捷的控制。通过本章的学习，学生应掌握HTML语言中常见标记的使用，对它们进行相应的属性设置，并能够按照页面设计要求编写HTML文档。学会在HTML网页中引用CSS样式表的几种方法，并能熟练的使用它格式化页面外观。同时，也为后续章节的学习打下良好的基础

30、。,1.4 习题,一、填空题二、单项选择题三、简答题四、HTML文档编写与分析。,一、填空题,1标签中的bgcolor属性用于指定HTML文档的设置网页的背景颜色，text属性用于指定HTML文档中文本的颜色，background属性用于指定HTML文档的背景文件。2图像标记用于将图象插入到HTML网页中。3图像标签中的align属性的参数值为top、middle或bottom，分别表示与图像相邻的文字位于图像的上方、中间和下方。4HTML中，文本样式标记用于将文本显示为强调格式。5单元格标记用于定义表格单元格。6在HTML文档中URL标记是指定义目标网址。,二、单项选择题,1下列语句中，（B

31、）将HTML页面的标题设置为“HTML练习”。(A)HTML练习(B)HTML练习(C)HTML练习(D)HTML练习2（C）属性指定向服务器发送表单数据的方法。(A)accept(B)action(C)method(D)form3（A）标记可将外部样式表链接到当前html文档中。(A)link(B)import(C)href(D)src4要在网页中显示下列内容：网页制作基础知识。要求将“基础”两个字用25号字体显示。下面语句正确的是（C）(A)网页制作基础知识(B)网页制作基础知识(C)网页制作基础知识(D)网页制作基础知识,5（A）标记用于指定在当鼠标移动到图像上时，显示替代文字。(A)A

32、LT(B)IMG(C)HR(D)SRC6要设置以访问过链接的颜色为红色，下列选项正确的是（C）(A)A:linkcolor:red(B)A:activecolor:red(C)A:visitedcolor:red(D)A:visitecolor:red7（B）是指在一张图片上创建多个热区链接。(A)图形映射(B)超链接(C)锚点(D)焦点8下面哪一项不属于HTML文档的三个基本组成部分（D）(A)html部分(B)head部分(C)body部分(D)注释部分,三、简答题,1描述创建一个站点的基本步骤和需要注意的要点。2描述一个HTML文档的基本结构，并写出其代码。3描述框架网页中框架集和框架的

33、特点。4描述CSS样式表的几种常用选择器及特点。,1描述创建一个站点的基本步骤和需要注意的要点。,网页总体规划首先考虑和设计网页的框架结构和艺术风格。可以先画出网站的草图，确定网站中各网页之间的链接关系，这样在创建每个网页时都会有清晰的思路，以免迷失方向，而且以后需要进行重组的可能性较小。网页的主题定位确定为什么要创建这个网页及希望展示的内容。创建此页面的目的是让访问者一打开网页就能发掘学习的内容，同时显示友好的标语欢迎访问者图片、声音等媒体文件的使用要让网页更加美观，更具人性化，可在网页中适当添加图片、动画、音/视频等多媒体文件。为了保证网页的传输速度，选择网络上常见的媒体格式，并将它们放置

34、在相应的文件夹中制作工具的选择可使用FrontPage、DreamWeaver等网页制作软件。在本案例中，将使用DreamWeaver MX进行“网页制作学习园地”网站的创建,2描述一个HTML文档的基本结构，并写出其代码,HTML结构包括头部（Head）、主体（Body）两大部分。头部放置文档标题，也可以指明浏览器在显示文档时可能会用到的其他参数；主体放置文档的实际内容，包括要显示的文本和文档的控制标记（标签），这些标记将告诉浏览器该如何显示文本。标签还可以引用特殊效果的文件，包括图像、图形、声音和动画，并指出将文档链接到其他文档的热点。,3描述框架网页中框架集和框架的特点,框架集：几个框架

35、的组合。一个框架集是一个HTML文件，用来定义框架结构，即一组框架的布局和属性，如框架的数目、大小和位置等。一个框架对应一个HTML文件，框架集中的每个框架可以显示不同的HTML文件内容。故框架网页是一个HTML集，对于一个有n个区域的框架网页来说，有n+1个HTML文件。在框架网页中被标记取代。,4描述CSS样式表的几种常用选择器及特点,四、HTML文档编写与分析,1利用列表标识符编写HTML文档，在网页上创建以下形式的列表。网页效果图如下：,2根据下列要求编写CSS样式表文件。(1)将body中的字体设置为12号、黑色、宋体，并设置一张背景图片。(2)将table中的字体为16px、深蓝色

36、、仿宋体。(3)将链接文本、已访问过链接文本、活动链接文本的颜色分别设置为蓝色、红色和绿色。,习题ONE,我们公司男生少女生多，大龄少年轻的多,我们公司男生少女生多，大龄少年轻的多,3请按照表格在页面中的显示效果，编写HTML文档。网页效果如下图所示。,1.5 实训,实训项目：创建个性化的班级网站 学生自行设计一个个性化的班级网站。要求运用本章学习的HTML语言标记，并合理设置其相关属性，达到内容与形式的完美统一。实现要求：1网站的规划（1）首先勾画出本网站的整体设计图，确定其导航结构；（2）准备创建网站需要用到的素材，设计目录结构；（3）网站的总体艺术风格为活泼、富有朝气。2创建本地站点（1

37、）在计算机硬盘中新建文件夹，并命名为class site，做为站点；（2）在站点中根据个人创作的实际情况建立子文件夹，用于放置不同的网页元素，其命名使人望文知意。,3主页的制作（1）利用框架页面布局方式，创建班级主页。框架集中包含三个框架区域：上框架、左框架和主框架，分别命名为topframe.htm、leftframe.htm和mainframe.htm；（2）在上框架中设置一幅背景图片，并注明网页标题；（3）为左框架设置背景颜色。在左框架中设置班级通讯录、班级相册、班级视频、班级趣事、班级邮箱等超级链接。利用表格为链接文字定位；设置前三个被链接文件在主框架窗口中打开，其中将“班级视频”链接到一个视频文件。“班级邮箱”链接到E-MAIL地址。使“班级趣事”网页在新的浏览器窗口中打开；（4）在上框架中设置从左向右滚动的欢迎字幕。当鼠标指针移动到滚动的欢迎字幕上时，文字停止滚动，移下鼠标后继续；4“班级趣事”网页的制作（1）编写CSS样式表文件，并利用链接外部样式表的方法将其在“班级趣事”网页中引用，使样式表能够对页面的外观显示进行控制。（2）在网页中添加FLASH一个动画。（3）为网页添加.mid格式的背景音乐。,