第三章 第10讲 网页设计基础知识

第三章 第10讲 网页设计基础知识

考点剖析

【知识要点】

一、基本概念

1.网页

网页一般又被称作HTML文档，是一种可以在互联网上传输，能被浏览器识别和翻译成网面并显示出来的文件。网页分为静态网页（扩展名：html或htm等）和动态网页（扩展名：asp、php、jsp等）。

网页要素：文本、图像（gif、jpeg）、多媒体元素、超链接、脚步程序。

2.网站

网站：网站又称Wbe站点，是指在网络上，根据一定的规则，使用网页开发软件制作的用于展示特定内容的相关网页的集合。网站首页的主文件名：index、Default，扩展名依照上面网页。

3.网站、主页与网页的关系

网站是指在网络上，根据一定的规则，使用网页开发软件制作的用于展示特定内容的相关网页的集合，由主页和其他网页组成。用户在浏览器的地址栏输入网址后见到的第一个页面称为主页，主页是网站中所有网页的索引页，通过单击主页上的超链接可以打开其他的网页。

4.制作工具

常见的网页制作工具有DreamWeaver、FrontPage等。

二、Dreamweaver CS3的工作界面

Dreamweaver CS3工作界面主要由标题栏、菜单栏、插入栏。文档工具栏、文档窗口、属性面板、状态栏、面板组等组成，如下图所示。

Dreamweaver CS3工作界面

1.菜单栏

1.菜单栏位于Dreamweaver CS3窗口最上方，提供了各种操作命令。在Dreamweaver 其他版本中，“插入记录”菜单也可能是“插入”菜单。

2.文档工具栏

“文档”工具栏提供了视图模式切换的按钮和与查看文档、在本地和远程站点间传输文档有关的常用命令和选项，如下图所示。

3.文档窗口

文档处理显示当前打开的文档，分为“代码”视图、“设计”视图和同时显示“代码”视图和“设计”视图的“拆分”视图三种视图模式。启动Dreamweaver CS3后，默认的文档窗口视图为“设计”视图。

4.状态栏

状态栏位于文档窗口的底部，用于显示正在编辑的文档有关的信息，如下图所示。

（1）选取工具：用于选取“文档”窗口内的对象。

（2）手形工具：对象大于“文档”窗口时，用来移动对象的位置。

（3）缩放工具：使用该工具后，单击“文档”窗口可增大显示比例，按下Alt键单击可减小显示比例。

5.属性面板

“属性”面板用于查看和编辑当前选定对象的各种属性。不同页面元素对应的“属性”面板也不同。启动Dreamweaver后，默认的属性面板为文本属性面板。

6.面板组

单击面板组与文档窗口间的“隐藏/显示面板”按钮，可以将所有面板隐藏或显示。

7.标尺和网格

使用标尺好网格可以在调整网页中一些对象的位置和大小时使操作更加准确。

（1）标尺

选择“查看→标尺→显示”命令，可在文档窗口的左边和上边显示标尺。

（2）网格

选择“查看→网络设置→显示网络”命令，可以显示或隐藏网格。注意：标尺和网格只在网页文档窗口内显示，在浏览器中不会显示。

【典型例题】

【例1】在Dreamweaver中，通过“文档”工具栏不能完成的操作是（）

A.切换文档窗口的视图模式B.修改网页文件名

C.打开浏览器预览当前网页D.上传文件到远程服务器

【答案】 B

【分析】文档工具栏提供了视图模式切换按钮和预览文档、传输文档等命令和选项，通过工具栏上的“标题”框可以修改当前网页的标题，但不能修改网页文件名。

【例2】在Dreamweaver中，默认显示的属性面板是（）

A.“文本属性”面板B.“图像属性”面板

C.“表格属性”面板D.“页面属性”面板

【答案】A

【分析】启动Dreamweaver后，默认的属性面板是文本属性面板，只有在页面中选择了其他页面元素，才会显示对应的属性面板。

能力提升

一、单项选择题

1.以下说法错误的是

A.WWW在服务上采用是客户机/服务器模式

B.Dreamweaver是集网页设计、网站开发和管理于一体的软件

C.所有网页的扩展名必须是htm或html才能被访问

D.一个网站只能有一个主页

2.在Dreamweaver的工作窗口中，用来提供与正在编程的文档有关的信息和工具的（）A属性面板B状态栏C标签选择器D插入栏

3.新浪网的网址是http://www.sina.com.cn，其中http是指（）

A主机名称B.协议名称

C.顶级域名D.端口地址

4.在Dreamweaver的启动界面中，不能完成的操作是（）

A.打开最近编辑过的网友文件B.创建一个新网页文件

C.选择文档窗口的视图模式D.查看新增的功能

5.以下不属于插入栏类别的是（）A.常用B.数据C应用程序D.收藏夹

6.启动Dreamweaver后，文档窗口默认的视图模式是

A.设计视图B.扩展视图

C.代码视图D.布局视图

7.在Dreamweaver中的状态栏上“1024×768”的含义是（）

A.当前文档窗口的大小

B.显卡的最大分辨率

C.当前被选中图像的像素大小

D.整个Dreamweaver窗口的大小

8.在插入工具栏中，按钮 的含义是（）

A.超级链接B.电子邮件链接

C.命令锚记D.模板

9.在“科技在线”站点中新建一个网页文件时，默认的网页标题是（）

A.科技在线B.无标题文件

C.空白D.未命名文档

10.以下说法错误的是（）

A.通过标签选择器可以选择各种页面元素

B.启动Dreamweaver后，默认的属性面板是文本属性面板

C.状态栏上手形工具的作用是增加或减少显示比例

D.要切换各种视图模式，可通过文档工具栏来实现

11.在Dreamweaver中，要打开或隐藏各种面板，可使用的菜单是（）

A.命令B.窗口C.查看D.编辑

12.关于属性面板，以下说法错误的是（）

A可以用来设置当前网页的页面属性

B.主要用于查看和编辑当前选定对象的各种属性

C.启动Dreamweaver后默认的“属性”面板不同

D.不同页面元素对应的“属性”面板不同

13.设置标尺的尺寸单位时，不包括的单位是（）

A.像素B.百分比C.英寸D.厘米

二、填空题

1＿＿＿＿是指在网络上，根据一定的规则，使用网页开发软件制作的用于展示特定内容的相关网页的集合。

2.当用户在浏览器的地址栏中输入网址后看见的第一个页面称为＿＿＿＿。

3.WWW在服务上采用的是＿＿＿＿模式。

4.在＿＿＿＿视图中可在一个窗口中同时看到同一文档的“代码”视图和“设计”视图。

5.使用缩放工具时，按下＿＿＿＿键在窗口中单击可减小显示比例。

二、简答题

1.简述网站、主页与网页的关系

2.简述Dreamweaver的工作界面。