网页设计与制作期末试题及答案

合集下载

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

网页设计与制作模拟试题（一）
一、单项选择题(每空1分，共10分)
1.目前在Internet上应用最为广泛的服务是( B )。

A.FTP服务
B.WWW服务
C.Telnet服
务 D.Gopher服务
2.在域名系统中，域名采用( C )。

A.树型命名机制
B.星型命名机制
C.层次型命名机制
D.网状型命名机制
3.HTTP协议是一种(D )协议。

A．文件传输协议 B．远程登录协议
C．邮件协议 D．超文本传输协议
4.HTML语言中的转行标记是(B )。

A.<html>
B.<br>
C.<title>
D.<p
>
5.在HTML中，标题字体标记<hx>中x的最大取值是( C )。

A.4
B.5
C.6
D.7
6.以下不能用来定义表格内容的标记为( A )。

A.<br>
B.<tr>
C.<th>
D.<td>
7.下面不是组成一个HTML文件基本结构标记的是( C )。

A.<HTML></HTML>
B.<HEAD></HEAD>
C.<FORM></FORM>
D.<BODY></BODY>
8. 加入一条水平线的HTML代码是( A )。

A. <hr>
B. <img src="name" border=?>
C. <img src="name" align=?>
D. <img src="name">
9.在HTML中，标记<pre>的作用是( B )。

A.标题标记
B.预排版标记
C.转行标记
D.文字效果标记
10.要创建一个Email地址的链接，下面正确的句法是
( A )。

A. <a href=“mailto:**************”>与我联系</a>
B. <a href=“files:**************”>与我联系</a>
C. <a href=“http:**************”>与我联系</a>
D. <a href=“usenet:**************”>与我联系</a>
11. 客户/服务器系统的最大特点是客户机和服务器( D )
A. 必须运行在同一台机器上
B. 必须运行在同一个网络上
C. 必须运行在不同的计算机上
D. 不必运行在同一计算机上
12. 若需要软件把LAN上的客户机从Internet上隐藏起来，并为客户机执行Web 请求，则下面( D )软件能实现此项功能。

A. Internet Information Server
B. Index Server
C. Personal Web Server
D. 代理服务器
13. 通常一个站点的主页默认文档名是( C )
A. Main.htm
B. Webpage.htm
C. Index.htm
D. Homepage.htm
14. 通常，比较好的建立站点目录的习惯是( A )
A. 在根目录下建立一个总的IMAGE目录放置图象文件
B. 直接把图象文件放置在各栏目的目录下
C. 为各栏目建立一个单独的IMAGE目录放置图象文件
D. 在每个目录下建立一个IMAGE目录放置图象文件
15. . 以下有关页面布局的说法正确的是( D )
A. 分辨率越高，可供使用的页面尺寸越大
B. 网页布局与平面设计一样，不受页面大小的影响
C. 页眉和页脚中只能出现文本，不能出现图形
D. 页面布局通常是通过手工设计的，目前还没有相应的电脑软件完成这一工作
16. . 以下关于HTML文档的说法正确的一项是( A )
A. <HTML>与</HTML>这两个标记合起来说明在它们之间的文本表示两个HTML文本
B. HTML文档是一个可执行的文档
C. HTML文档只是一种简单的ASCII码文本
D. HTML文档的结束标记</HTML>可以省略不写
17. 正确描述创建一个一级标题居中的句法是( D )
A. <H0 ALIGN=CENTER> Heading Text </H0>
B. <H1 ALIGN=CENTER> Heading Text </H1>
C. <H ALIGN=CENTER> Heading Text </H>
D. <HT ALIGN=CENTER> Heading Text </HT>
18. 8. 要创建一个Email地址的链接，下面正确的句法是( A )
A.<ahref=“mailto:**************”>与我联系</a>
B.<ahref=“files:**************”>与我联系</a>
C.<ahref=“http:**************”>与我联系</a>
D.<ahref=“usenet:**************”>与我联系</a>
19. 下列是可以放置在<FORM>和</FORM>之间的标记，其中用于定义一个用户可键入多行文本的标记是( B )
A. <select>
B. <textarea>
C. <input>
D. <body>
20. 在HTML中定义一个书签应该使用( A )
A. <a name=“bookmark”> text </a>
B. <a href=“#bookmark”> text </a>
C. <a link=“#bookmark”> text </a>
D. <a target=“#bookmark”> text </a>
二、简答题(每题6分，共60分)
1、简述Web浏览器打开一个Web文件的工作过程。

2、描述网页设计的一般步骤。

3、简述网页设计的基本准则。

4、简述规划网站目录结构时应遵循的原则。

5、描述版面布局的步骤。

6、什么是“HTML”？HTML“标记”又是什么？
7、简述“HTML”文档的基本结构。

8、简述以下一段HTML代码中各对标记的作用。

〈html〉
〈head〉
〈title〉网页设计〈/title〉
〈/head〉
〈body〉
〈h2〉北国风光〈/h2〉
〈/body〉
〈/html〉
9、如何进行本地网页的测试？
10、网站管理和维护的主要工作有哪些？
三、问答题(每题15分，共15分)
1、描述建设一个网站的具体步骤。

四、综合题(每题15分，共15分)
1、设计一个旅游网网站的首页，请画出轮廓并加以说明。

模拟试题一参考答案
一、单项选择题(每空1分，共10分)
B、C、D、B、C、 A、C、A、B、A、
二、简答题(每题6分，共60分)
1、简述Web浏览器打开一个Web文件的工作过程。

1）Web浏览器向服务器发出页面请求
2）服务器接收页面请求，并将搜索到的页面发给Web浏览器
3）Web浏览器接收并显示页面
每步２分，要加以说明，否则１分
2、描述网页设计的一般步骤。

1)设计主题
2)设计网页的总体结构
3)资料的收集和整理
4)选择网页的设计方法
5)注意一些基本问题，如：标题要简明、图片最好加说明等
一个一分，答全６分
3、简述网页设计的基本准则。

需要遵循的艺术原则主要有：
1）对比原则
2）协调原则
3）平衡原则
4）趣味原则。

还包括统一、连贯、分割、对比、和谐、易读、易找、清晰、精选。

一个一分，６个以上得６分
4、简述规划网站目录结构时应遵循的原则。

在创建目录时需要注意：
（1）不要将所有文件都存放在根目录下。

（2）目录层次不要太深，建议不要超过三层。

（3）不要使用过长的目录名和尽量不要使用中文目录名。

每步２分，要加以说明，否则１分
5、描述版面布局的步骤。

步骤：
1）绘制网页草图
2）粗略布局
3）定案
每步２分，要加以说明，否则１分
6、什么是“HTML”？HTML“标记”又是什么？
HTML是一种建立网页文件的语言，透过标记式指令，将影像、声音、图片和文字等连接起来。

在HTML中用于描述功能的符号称为“标记”，它是用来控制文字、图形等显示方式的符号。

每个３分，要加以说明，否则１分
7、简述“HTML”文档的基本结构。

HTML网页的基本结构。

<HTML> HTML文件开始
<HEAD> 文件头开始
文件头
</HEAD> 文件头结束
<BODY> 文件体开始
文件体
</BODY> 文体结束
</HTML> HTML文件结束
完整得全分，否则一组标记２分
8、简述以下一段HTML代码中各对标记的作用。

〈html〉
〈head〉
〈title〉网页设计〈/title〉
〈/head〉
〈body〉
〈h2〉北国风光〈/h2〉
〈/body〉
〈/html〉
包括文件开始标记、文件头标记、标题标记、文件体标记、换段标记及相关的一些属性。

一个一分
9、如何进行本地网页的测试？
在本地机器上进行测试的基本方法是用浏览器浏览网页，从网站的首页开始，一页一页地测试，以保证所有的网页都没有错误。

在不同的操作系统以及不同的浏览器下网页可能会出现不同的效果，甚至无法浏览，就算是同一种浏览器但在不同的分辨率显示模式下，也可能出现不同的效果。

解决办法就是使用目前较主流的操作系统（如windows、unix）和浏览器（如microsoft internet explorer 、netscape navigator）进行浏览观察。

本地测试的另一项重要工作就是要保证各链接的正确跳转，一般应将网页的所有资源相对于网页“根目录”来进行定位，即使用相对路径来保证上传到远程服务器上后能正确使用。

本地测试还涉及到一些工作如检查网页的大小、脚本程序能否正确运行等。

要点一个２分，需展开
10、网站管理和维护的主要工作有哪些？
网站的管理维护主要包括检测网站的错误、保证网站正常运转、处理用户信息、定期更新网页内容和修正网页错误等。

网站的管理维护可以使用一些专业的软件来实现。

对于公司、企业等单位，尤其是拥有自己服务器的单位，则需要配置专门的网站管理员来管理和维护。

三、问答题(每题15分，共15分)
1、描述建设一个网站的具体步骤。

建设一个网站一般要经过以下步骤：制作环境的准备，网站目标的确定，网站的主题、风格和创意点的确定，网站结构的确立，网站素材的准备，网站制作工具的选择和确定，网站的建立，网站的测试和上传，网站的宣传和推广以及网站的更新和维护。

一步１，５分．需展开
四、综合题(每题15分，共15分)
1、设计一个旅游网网站的首页，请画出轮廓并加以说明。

应有栏目：旅游新闻播报系统、目的地指南系统、门票预订系统、酒店预订系统、交通信息发布系统、用户注册管理系统等。

讲究创意和内容。

创意占５分，内容占７分，组织占３分
网页设计与制作期末模拟试题（二）
一．选择题
1.Web浏览器的作用是（ A ）。

A．负责下载并显示网页，能将Web文档的HTML编码解释，并显示为在浏览器上所见的Web页面
B．运行在服务器仅供服务器维护员使用的专用浏览器
C．浏览Web页面部分内容比整个页面内容要快
D．下载网页时不是根据页面中的HTML编码分别下载信息，而是一种随机性的下载方式
2.HTTP协议是（ C ）。

A．远程登录协议B．邮件协议
C．超文本传输协议D．文件传输协议
3.下列标记可以不成对出现的是（ B ）。

A．〈html〉〈/html〉B．〈p〉〈/p〉
C．〈title〉〈/title〉D．〈body〉〈/body〉
4.下列（ C ）不能在网页的“页面属性”中进行设置。

A．文档编码
B．背景颜色、文本颜色、链接颜色
C．网页背景图及其透明度
D．跟踪图像及其透明度
5.在表格标记中，cellpadding属性的作用是（ C ）。

A．表格与页面边距B．表格扩展边距
C．数据与表框距离D．表格边的宽度
6.对于标记〈input type=*〉，其中*位置放上一个值，表示输入时显示*号，
该值是（ C ）。

A．hidden B．text
C．password D．submit
7.CSS的含义是（ C ）。

A．文档对象模型B．客户端脚本程序语言
C．级联样式表D．可扩展标记语言
8.HTML语言是一种（ A ）。

A．标注语言B．机器语言C．汇编语言D．算法语言
9.超级链接应该使用的标记是（ C ）
A．〈title〉B．〈body〉
C．〈a〉D．〈head〉
10.下列关于CSS的说法错误的是（ C ）。

A．CSS的全称是Cascading Style Sheets，中文的意思是“层叠样式表”
B．CSS样式不仅可以控制大多数传统的文本格式属性，还可以定义一些特殊的HTML属性
C．使用Dreamweaver只能可视化创建CSS样式，无法以源代码方式对其进行编辑
D．CSS的作用是精确定义页面中各元素以及页面的整体样式
11.关于绝对路径的使用，以下说法错误的是（ A ）。

A．使用绝对路径的链接不能链接本站点的文件，要链接本站点文件只能使用相对路径
B．绝对路径是指包括服务器规范在内的完全路径，通常使用http:// 来表示
C．绝对路径不管源文件在什么位置都可以非常精确地找到
D．如果希望链接其它站点上的内容，就必须使用绝对路径
12.在表格标记中，<td></td>标签表示（ B ）。

A．表格中的行B．表格中的列
C．表格中的单元格D．表格边的宽度
13.以下几个事件中代表“鼠标滑到”的事件是（ C ）。

A．OnMouse Down
B．OnMouse Out
C．OnMouse Over
D．OnouseUp
14.关于表格背景，说法正确的是（ B ）。

A．只能定义表格背景颜色，不能用图片作为表格背景
B．可以使用颜色或图片作为表格背景图，但图片格式必须是GIF格式
C．可以使用颜色或图片作为表格背景图，但图片格式必须是JPEG格式
D．可以使用颜色或图片作为表格背景图，可以使用任何的GIF或者JPEG图片文件
15.下图中显示的表单元素有（ D ）。

A．文本字段、单选按钮、多选按钮、列表/菜单
B．文本字段、列表/菜单、邮件区域、单选按钮
C．文本字段、列表/菜单、密码型文本域、单选按钮
D．文本字段、列表/菜单、单选按钮、图像域
16.下列关于HTML的说法正确的是（ C ）。

A．HTML是网页的核心，是一种超文本标记的程序设计语言。

B．通过网页浏览器阅读HTML文件时，WEB服务器负责解释插入到HTML文本中的各种标记。

C．HTML是网页的核心，是一种超文本标记的语言，它是页面描述语言。

D．编制HTML文件时不需要加入任何标记(tag)。

17.目前在Internet上应用最为广泛的服务是（ B ）。

A．FTP服务
B．WWW服务
C．Telnet服务
D．Gopher服务
18.下列标记可以不成对出现的是（ B ）。

A．〈html〉B．〈br〉
C．〈title〉D．〈body〉
19.JavaScript包括在HTML中，它成为HTML文档的一部分，可将
<Script>...</Script>标识放入（ C ）。

A．只能在<Head>.. </Head>之间
B．只能在<Body>...</Body>之间
C．既可放入<Head>.. </Head>之间，也可放入<Body>...</Body>之间D．只能在<div>...</div>之间
20.在表格标记中，<tr></tr>标签表示（ A ）。

A．表格中的行B．表格中的列
C．表格中的单元格D．表格边的宽度
21.以下几个事件中代表“鼠标按下”的事件是（ A ）。

A．OnMouse Down
B．OnMouse Out
C．OnMouse Over
D．OnouseUp
22.添加背景音乐的HTML标签是（ A ）。

A．<bgsound>
B．<bgmusic>
C．<bgm>
D．<music>
二．填空题
1.目前，网页中使用的较多的图像格式主要是GIF、_JPEG；PNG
由于网页中包含超级链接，因此，网页也被称为超文本，传输协议被称为_超文本传输协议
2.当网页的内容较多时，对页面不同位置进行链接的是锚链接__。

3.在电子邮件链接中，__subject表示邮件主题；cc表示抄送地址。

4.绝对路径：是包含服务器协议的完整路径，是一个精确地址。

网页分成两种模式，_静态网页和动态网页。

5.创建一个留言表单，其中要求能够输入多行文本，留言内容项选用的表单文
本区域
6.一般来说，超级链接包含下列类型：文档链接、书签链接、和脚本链接。

7.绝对路径是包含服务器协议的完整路径，是一个精确地址。

三．判断题
1.在一个WEB站点中，主页就是网页，两者是一致的。

（×）
2.在HTML中，<br>标签表示换行。

（√）
3.创建超链接中，相对路径是包含服务器协议的完整路径，是一个精确的地址。

（×）
4.CSS样式表可以从外部导入，通过链接的形式，使用样式定义。

（√）
5.动态网页就是网页中有许多多媒体元素和一些动的效果，使用户感觉页面非
常有活力。

（×）
6.在HTML中，标签都必须有关闭标记。

（×）
7.JPEG图像是一种有损压缩的图像格式。

（√）
8.CSS样式，只能通过外部导入，并链接到网页，网页才能有效果。

（×）
9.在一个WEB站点中，每一个网页都有唯一的网址。

（√）
10.在HTML中，<td>标签表示换行。

（×）
11.GIF格式的图像最多只能表现256色，图像文件也很小。

（√）四．简答题
1.简述建立WEB站点的一般步骤。

答：建立WEB站点的一般步骤如下：
a)对创建的站点进行规划，明确建站的目的、规模、面向的群体、服务器
端的配置等各项情况；
b)建立一个完整的站点目录结构；
c)确定版面布局，收集和制作素材；
d)制作网页；
e)站点测试、发布及维护更新。

2.简述创建表单的基本步骤。

答：创建表单的基本步骤：
f)确定需要收集的信息，然后根据信息特点开始设计表单；
g)在表单中插入不同的表单元素；
h)设置表单域的输入规则；
i)设置通过表单所收集的信息的处理方式；
设置确认网页，确认已经收到用户填写的信息，并可与用户核对是否正确。

3.什么是CSS样式？并列举CSS样式的类型。

2.答：CSS样式是网页元素外观属性的集合。

它可以定义文字、表格、图像、
表单等网页元素的属性。

CSS样式的类型由：自定义CSS样式；HTML标签样式；CSS选择器样式。

4.说一说，你在本课程的学习过程中，感到最难学的部分是什么？并说明难在
何处？
五．操作题
1.根据网页截图，完成下面的HTML代码。

（注：表格背景颜色为99FFFF，并
且表格在网页内居中对齐）
<table width="400" border="1"
____align="center"_____________________________>
<tr>
<th height="36" __colspan______="3" scope="col">表格的使用</th> </tr>
<tr>
<td height="36"></td>
____<td></td>___________
<td rowspan="_2_____"></td>
</tr>
<tr>
<td height="36"></td>
<td></td>
</tr>
</table>
2.根据提供的素材和网页截图，写出网页的HTML代码。

图1 网页内容图片（图片路径：image/tou.gif）
图2 网页背景图片（图片路径：image/bg.gif）
图3 网页截图
1. <html>
<head>
<title>金缕衣</title>
</head>
<body background="image/bg.gif">
<p><font style="font-size:16px; font-weight:bold">唐诗欣赏——七言乐府</font></p>
<hr size="1">
<p align="center"><img src="image/tou.gif" width="397"
height="198"></p>
</body>
</html>
3.根据网页内容，完成下面的HTML代码。

<form id="form1" name="form1" method="post" action="">
<table width="400" border="0" align="center" class="table">
<tr>
<th height="22" colspan="2" bgcolor="#CCCCCC" scope="col"><div align="center">客户注册信息</div></th>
</tr>
<tr>
<td width="135"><div align="right">客户姓名：</div></td> ____________________D_____________（1）
</tr>
<tr>
<td><div align="right">密码：</div></td>
_____________________B____________（2）
</tr>
<tr>
<td><div align="right">确认密码：</div></td>
____________________E_____________（3）
</tr>
<tr>
<td><div align="right">性别：</div></td>
<td>
__________________C_____________（4）
___________________A______________（5）
</td>
</tr>
<tr>
<td><div align="right">城市：</div></td>
<td><label>
<select name="select">
<option>杭州</option>
<option>绍兴</option>
<option>温州</option>
<option>宁波</option>
<option>嘉兴</option>
</select>
</label></td>
</tr>
<tr>
<td colspan="2"><div align="center">
<input type="submit" name="Submit" value="提交" />
 
<label>
<input type="reset" name="Submit2" value="重置" />
</label>
</div></td>
</tr>
</table>
<label></label>
</form>
从下列选项中选择正确的选项填入上面的空缺处，完成网页代码。

A．<input type="radio" name="radiobutton" value="radiobutton" />女B．<td>
<input name="text" type="password" size="16" />（最多16个字符）</td>
C．<input type="radio" name="radiobutton" value="radiobutton" />男
D．<td >
<input name="text" type="text" size="16" />（最多16个字符）</td>
E．<td>
<input name="text" type="password" size="16" />
</td>
F．<input type="checkbox " name="checkbox " value="checkbox " />男G．<input type=" checkbox " name=" checkbox " value=" checkbox " />女H．<td>
<input name="text" type="submit" size="16" />
</td>
参考答案：
五．操作题
2. bgcolor="#99FFFF"；；<td></td> ；2；</tr>
3. D B E C A
其他题型
1、网页设计采用div+css有什么好处？
布局实现了表现与内容的分离，大大缩减页面代码，符合W3C的标准，兼容性更好；易于后期网站的更新、维护；SEO的优化：对搜索引擎更加友好，更容易被搜索引擎收录。

2、前端页面有哪三层构成，分别是什么？作用是什么？
网页分成三个层次，即：结构层、表示层、行为层。

网页的结构层（structural layer）由HTML或 XHTML之类的标记语言负责创建。

标签，也就是那些出现在尖括号里的单词，对网页内容的语义含义做出了描述，但这些标签不包含任何关于如何显示有关内容的信息。

例如，P 标签表达了这样一种语义：“这是一个文本段。

”
网页的表示层（presentation layer）由CSS负责创建。

CSS 对“如何显示有关内容”的问题做出了回答。

网页的行为层（behavior layer）负责回答“内容应该如何对事件做出反应”这一问题。

这是 Javascript 语言和 DOM 主宰的领域。

3. 将CSS放在HEAD中的好处
如果将CSS放在其他地方比如BODY中，则浏览器有可能还未下载和解析到CSS就已经开始渲染页面了，这就导致页面由无CSS状态跳转到CSS状态，用户体验比较糟糕。

除此之外，有些浏览器会在CSS下载完成后才开始渲染页面，如果CSS放在靠下的位置则会导致浏览器将渲染时间推迟。

6.什么是DOM
7.实现下面功能
1.）
将元素的子元素改为：我在参加考试！
<!DOCTYPE html>
<html>
<body>
<p id="p1">Hello World!</p>
<script>
document.getElementById("p1").innerHTML="我在参加考试"; </script>
<p>上面的段落被一条 JavaScript 脚本修改了。

</p>
</body>
</html>
2）.设置一个已知ID的DIV的html内容为xxxx，字体颜色设置为黑色(不使用第三方框架)
1 var dom = document.getElementById(“ID”);
2 dom.innerHTML = “xxxx”
3 dom.style.color = “#000”或”black”.
3). 完成foo()函数的内容，要求能够弹出对话框提示当前选中的是第几个单选框。

<html>
<body>
<script>
function foo() {
// 在此处添加代码
var rg = document.getElementsByN ame("radioGroup");
for( var i = 0; i
< rg.length; i++ )
{
if( rg[i].checked )
{
alert("你选择了第
" + (i+1) + "个单选框");
}
}
return false;
}
</script>
<body>
<form name="form1" onsubmit="return
foo();">
<input type="radio" name="radioGroup"/ >
<input type="radio" name="radioGroup"/ >
<input type="radio" name="radioGroup"/ >
<input type="radio" name="radioGroup"/
>
<input type="radio" name="radioGroup"/ >
<input type="radio" name="radioGroup"/ >
<input type="submit"/>
</form>
</body>
</html>
4.列举CSS样式引入方式
A)使用 LINK标签
将样式规则写在.css的样式文件中，再以<link>标签引入。

<STYLE TYPE="text/css">

</STYLE>
C) 使用STYLE属性
将STYLE属性直接加在个别的元件标签里，<元件(标签) STYLE="性质(属性)1: 设定值1; 性质(属性)2: 设定值2; ...}
5.读代码
写出函数DateDemo的返回结果，系统时间假定为今天
function DateDemo(){
var d, s="今天日期是：";
d = new Date();
s += d.getMonth() + "/";
s += d.getDate() + "/";
s += d.getYear();
return s;
}
6.当一个DOM节点被点击时候，我们希望能够执行一个函数，应该怎么做？
答：直接在DOM里绑定事件：<div onclick=”test()”></div> 在JS里通过onclick绑定：xxx.onclick = test
通过事件添加进行绑定：
addEventListener(xxx, ‘click’, test)。