国家开放大学《Dreamweaver网页设计》形考任务1-9参考答案.docx
- 文档编号:12221786
- 上传时间:2023-06-04
- 格式:DOCX
- 页数:22
- 大小:331.70KB
国家开放大学《Dreamweaver网页设计》形考任务1-9参考答案.docx
《国家开放大学《Dreamweaver网页设计》形考任务1-9参考答案.docx》由会员分享,可在线阅读,更多相关《国家开放大学《Dreamweaver网页设计》形考任务1-9参考答案.docx(22页珍藏版)》请在冰点文库上搜索。
国家开放大学《Dreamweaver网页设计》形考任务1-9参考答案
形考任务1
1、网页的内容应该包括哪些元素?
参考答案:
文本、图片和动画、声音和视频、超链接、表格、表单、导航栏等其它常见元素。
2、一般网站的规划与设计应该考虑哪些因素?
参考答案:
(1)清晰的网站目标定位
你明确了目标,就好像在茫茫大海中寻找到了前进的方向。
避免走过多的弯路。
只有选择正确了,才会有好的结果。
(2)注册域名
找准了方向以后,就要选择一个好记忆的域名让用户轻易的记住你的网站,方便下次访问。
这也是很关键的一步。
(3)服务器的选择
服务器关系着网站的后期发展。
好的服务器你可以放心的做网站运营推广,这远比选一个安全等等各方面做得不太好的空间强得多,起码你不用顾虑那么多。
(4)网站的制作
建议在做网站建设要根据自己的实际情况出发,量身定制自己的网站。
网站后台的制作网站的操作后台一点要简洁,便利。
网站结构的设计这点比较重要,一个网站做出来,一定要有合理的结构布局,一方面提高用户体验,一方面方便搜索引擎蜘蛛爬行。
(5)网站推广
站做好了以后就要把它推广出去,让更多的人认识了解我们这个站。
推广方法有很多,可以到各大论坛博客推广,百度竞价,QQ推广等等。
3、商业网站在规划与设计时应着重考虑哪些因素?
参考答案:
内容、易用、美观、交互。
形考任务2
(1)通过使用HTML,可以在文档中显示图像,插入一副图像(jpg)、插入一副动图图像(gif格式)。
(2)从不同位置,包括文件夹和网络,插入图像。
参考答案
(1)
一幅图像:
请注意,插入动画图像的语法与插入普通图像的语法没有区别。
(2)
来自另一个文件夹的图像:
来自网络的图像:
形考任务3
1.XHTML指的是?
A.EXtensibleHyperTextMarkupLanguage
B.EXtensibleHyperTextMarkingLanguage
C.EXtremeHyperTextMarkupLanguage
D.EXtraHyperlinksandTextMarkupLanguage
2.在下面的XHTML中,哪个可以正确地标记段落?
A.
B.
C.
D.
3.在下面的XHTML中,哪个可以正确地标记折行?
A.
B.
C.
4.下列XHTML中的属性和值,哪个是正确的?
A.width="80"
B.WIDTH="80"
C.width=80
D.WIDTH=80
5.在XHTML文档中哪些元素是强制性的?
A.doctype、html、head以及body
B.doctype、html、head、body以及title
C.doctype、html以及body
6.下列哪些是格式良好的XHTML?
A.
Ashortparagraph
B.
Ashortparagraph
C.
Ashortparagraph
7.在XHTML中有哪些不同的DTD?
A.Strict,Transitional,Loose
B.Strict,Transitional,Loose,Frameset
C.Strict,Transitional,Frameset
8.网页的主体内容将写在什么标签内部:
A.标签
B.
标签C.
标签
D.
标签9.HTML代码中,
A.文本加注下标线
B.文本闪烁
C.文本或图片居中
D.文本加注上标线
10.在HTML文档中使用有序列表应使用()标记。
A.
11.请判断以下说法是否正确:
XHTML是一个Web标准。
(√)
12.请判断以下说法是否正确:
XML和HTML会被XHTML取代。
(√)
13.请判断以下说法是否正确:
HTML会被XHTML取代。
(√)
14.请判断以下说法是否正确:
XHTML中所有的元素都需要关闭。
(√)
15.请判断以下说法是否正确:
DOCTYPE没有关闭标签。
(√)
16.请判断以下说法是否正确:
XHTML文档必须是格式良好的。
(√)
17.在XHTML中允许简写属性吗?
(×)
18.所有的XHTML文档都需要doctype吗?
(√)
19.请判断以下说法是否正确:
所有的XHTML标签和属性都必须是小写的。
(√)
20.请判断以下说法是否正确:
HTML5是XHTML的升级版本。
(×)
形考任务4
活动1:
采用CSS样式来设置背景、标题和段落的颜色。
HTML代码如下:
这是标题1
这是标题2
这是段落
这个段落设置了内边距。 活动2:
使用百分比或者像素值设置行间距。
HTML代码如下:
这是拥有标准行高的段落。
在大多数浏览器中默认行高大约是110%到120%。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
参考答案
body{background-color:
yellow}
h1{background-color:
#00ff00}
h2{background-color:
transparent}
p{background-color:
rgb(250,0,255)}
p.no2{background-color:
gray;padding:
20px;}
这是标题1
这是标题2
这是段落
这个段落设置了内边距。 (1)百分比
p.small{line-height:
90%}
p.big{line-height:
200%}
这是拥有标准行高的段落。
在大多数浏览器中默认行高大约是110%到120%。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
(2)像素值
p.small{line-height:
10px}
p.big{line-height:
30px}
这是拥有标准行高的段落。
在大多数浏览器中默认行高大约是20px。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
形考任务5
使用
元素以及CSS样式表对下面的内容进行的布局设计。城市介绍
北京
上海
南京
南京
简称“京”,是中华人民共和国的首都、直辖市、国家中心城市、超大城市、国际大都市,全国政治中心、文化中心、国际交往中心、科技创新中心,是中国共产党中央委员会、中华人民共和国中央人民政府、全国人民代表大会、中国人民政治协商会议全国委员会、中华人民共和国中央军事委员会所在地,也是中部战区司令部驻地。
北京位于华北平原北部,背靠燕山,毗邻天津市和河北省。
北京的气候为典型的北温带半湿润大陆性季风气候。
北京是首批国家历史文化名城和世界上拥有世界文化遗产数最多的城市,三千多年的历史孕育了故宫、天坛、八达岭长城、颐和园等众多名胜古迹。
早在七十万年前,北京周口店地区就出现了原始人群部落“北京人”。
公元前1045年,北京成为蓟、燕等诸侯国的都城。
公元938年以来,北京先后成为辽陪都、金中都、元大都、明、清国都。
1949年10月1日成为中华人民共和国首都。
参考答案
#header{
background-color:
black;
color:
white;
text-align:
center;
padding:
5px;
}
#nav{
line-height:
30px;
background-color:
#eeeeee;
height:
300px;
width:
100px;
float:
left;
padding:
5px;
}
#section{
width:
350px;
float:
left;
padding:
10px;
}
#footer{
background-color:
black;
color:
white;
clear:
both;
text-align:
center;
padding:
5px;
}
城市
北京
上海
南京
B.
C.
D.
London
北京,简称“京”,是中华人民共和国的首都、直辖市、国家中心城市、超大城市、国际大都市,全国政治中心、文化中心、国际交往中心、科技创新中心,是中国共产党中央委员会、中华人民共和国中央人民政府、全国人民代表大会、中国人民政治协商会议全国委员会、中华人民共和国中央军事委员会所在地,也是中部战区司令部驻地。
北京位于华北平原北部,背靠燕山,毗邻天津市和河北省。
北京的气候为典型的北温带半湿润大陆性季风气候。
北京是首批国家历史文化名城和世界上拥有世界文化遗产数最多的城市,三千多年的历史孕育了故宫、天坛、八达岭长城、颐和园等众多名胜古迹。
早在七十万年前,北京周口店地区就出现了原始人群部落“北京人”。
公元前1045年,北京成为蓟、燕等诸侯国的都城。
公元938年以来,北京先后成为辽陪都、金中都、元大都、明、清国都。
1949年10月1日成为中华人民共和国首都。
形考任务6
HTML表单用于搜集不同类型的用户输入,包括文本输入、单选按钮输入、提交按钮,达到效果入下图所示。
参考答案
形考任务7
1.讨论模版的使用要点。
(1)包括网页中应用模版的方法
参考答案:
(1)直接创建模板
(2)将普通网页另存为模板
(3)从文件菜单新建模板
(2)如何将当前设计好的页面转换为模板
参考答案:
建立模板的另一种方法是将普通网页另存为模板,具体如下:
(1)打开一个已经制作完成的网页(如图7.7所示),删除网页中存在差别的区域,保留相同的区域。
如图7.8所示。
图7.7制作完成的网页
图7.8删除网页中存在差别的区域,保留相同的区域
(2)选择【文件】|【另存为模板】将网页另存为模板。
(3)在如图7.9所示的【另存模板】对话框中,【站点】下拉列表框用来设置模板保存的站点,可选择一个选项。
【现存的模板】选框显示了当前站点中的所有模板。
【另存为】文本框用来设置模板的命名。
单击【另存模板】对话框中的【保存】按钮,将把当前网页转换成模板,同时将模板另存到选择的站点中。
图7.9另存模板
(4)单击【保存】按钮,保存模板。
系统将自动在根目录下创建Template文件夹,并将创建的模板文件保存在该文件夹中。
窗口的左上角会出现模板的名称。
如图7.10所示。
图7.10保存的模板
图7.11警告信息
(3)如何使用模板生成多个页面
参考答案:
模板可被理解成一种模型,用这个模型可以方便地做出很多页面,然后在此基础上可以对每个页面进行改动,加入个性化的内容。
为了统一风格,一个网站的很多页面都要用到相同的页面元素和排版方式,使用模板可以避免重复地在每个页面输入或修改相同的部分,等网站改版的时候,只要改变模板这个文件的设计,就能自动更改所有基于这个模板的网页。
可以说,模板最强大的用途之一就在于一次更新多个页面。
从模板创建的文档与该模板保持连接状态(除非用户以后分离该文档),可以修改模板并立即更新基于该模板的所有文档中的设计。
2.如何在网页中应用库
(1)如何网页中建立库
参考文件:
(1)单击资源面板库分类上的新建按钮,新的库文件出现在窗口之中,给新库文件命名。
如图7.41所示。
图7.41新建库文件
(2)双击新建的库文件,打开库文件编辑窗口。
如图7.42所示。
图7.42库文件编辑窗口
提示:
库文件实际上是要插入在网页中的一段代码,所以库文件的编辑窗口,除不可以设置页面属性外,其他和普通网页的编辑方式一样。
(3)选择【文件】|【保存】,保存库文件。
Dreamweaver将把库的项目文件保存在站点本地文件夹下的Library子文件夹里,保存为.lbi文件。
如果本地站点没有这个子文件夹,Dreamweaver将自动生成这个子文件夹。
(2)如何插入库、选择内容转换为库
参考答案:
刚刚创建好库文件后,对于转换成库文件的内容,网页中已经拥有了这个库文件。
即背景会显示为淡黄色,不可编辑。
如图7.44所示。
图7.44页面中的库文件
对于新建立的库文件,如果希望在网页中插入库文件,操作如下:
(1)将光标放置在网页中要插入库文件的位置。
(2)在文件管理器中,选中要插入的库文件,选择窗口下方的【插入】按钮。
插入到网页中的库文件背景同样会显示为淡黄色,同样是不可编辑的。
(3)如何将库内容插入多个文档
参考答案:
选中网页上插入的库文件上,在属性面板中选择【从源文件中分离】。
如图7.47所示。
图7.47库文件属性面板
这样,原来的库文件区域就可以在网页中直接编辑了。
在修改库文件之后,脱离库文件的网页也不会更新了。
形考任务8
HTML调用js实现多项滑动门选项卡特效。
参考代码
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
//www.w3.org/1999/xhtml">
//
CDATA[
functiong(o){returndocument.getElementById(o);}
functionhover_zzjs_net(n){
//如果有N个标签,就将i<=N;
for(vari=1;i<=6;i++){g('tab_zzjs_'+i).className='nor_zzjs';g('tab_zzjs_0'+i).className='undis_zzjs_net';}g('tab_zzjs_0'+n).className='dis_zzjs_net';g('tab_zzjs_'+n).className='hovertab_zzjs';}
//如果要做成点击后再转到请将
//]]>
你的代码
参考答案
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
//www.w3.org/1999/xhtml">
//
CDATA[
functiong(o){returndocument.getElementById(o);}
functionhover_zzjs_net(n){
//如果有N个标签,就将i<=N;
for(vari=1;i<=6;i++){g('tab_zzjs_'+i).className='nor_zzjs';g('tab_zzjs_0'+i).className='undis_zzjs_net';}g('tab_zzjs_0'+n).className='dis_zzjs_net';g('tab_zzjs_'+n).className='hovertab_zzjs';}
//如果要做成点击后再转到请将
//]]>
hover_zzjs_net (1);">一、内容
hover_zzjs_net (2);">二、内容 hover_zzjs_net(3);">三、内容 hover_zzjs_net(4);">四、内容 hover_zzjs_net(5);">五、内容 hover_zzjs_net(6);">六、内容