PDF
【文档说明】国家开放大学Dreamweaver网页设计形考任务1-9参考答案.pdf，共(22)页，1.220 MB，由小喜鸽上传
转载请保留链接：https://www.ichengzhen.cn/view-157510.html
以下为本文档部分文字说明：
国家开放大学《Dreamweaver网页设计》形考任务1-9参考答案形考任务11、网页的内容应该包括哪些元素？参考答案：文本、图片和动画、声音和视频、超链接、表格、表单、导航栏等其它常见元素。2、一般网站的规划与设计应该考虑哪些因素
？参考答案：(1)清晰的网站目标定位你明确了目标，就好像在茫茫大海中寻找到了前进的方向。避免走过多的弯路。只有选择正确了，才会有好的结果。（2）注册域名找准了方向以后，就要选择一个好记忆的域名让用户轻易的记住你的网站，方便下次访问。这
也是很关键的一步。（3）服务器的选择服务器关系着网站的后期发展。好的服务器你可以放心的做网站运营推广，这远比选一个安全等等各方面做得不太好的空间强得多，起码你不用顾虑那么多。（4）网站的制作建议在做网站建设要根据自己的实际情况出发，量身定制自己的网站
。网站后台的制作网站的操作后台一点要简洁，便利。网站结构的设计这点比较重要，一个网站做出来，一定要有合理的结构布局，一方面提高用户体验，一方面方便搜索引擎蜘蛛爬行。（5）网站推广站做好了以后就要把它推广出去，让更多的人认识了解我
们这个站。推广方法有很多，可以到各大论坛博客推广，百度竞价，QQ推广等等。3、商业网站在规划与设计时应着重考虑哪些因素？参考答案：内容、易用、美观、交互。形考任务2（1）通过使用HTML，可以在文档中显示图像，插入一副图像（jpg）、插入一副动图图像（gif格式）
。（2）从不同位置，包括文件夹和网络，插入图像。参考答案（1）<html><head></head><body><p>一幅图像：<imgsrc="/i/eg_mouse.jpg"width="128"height="128"/></p><p><imgsrc="/i/eg_cu
te.gif"width="50"height="50"/></p><p>请注意，插入动画图像的语法与插入普通图像的语法没有区别。</p></body></html>（2）<html><head></head><body><p>来自另一个文件夹的图像：<imgsrc="/i/abc.
jpg"/></p><p>来自网络的图像：<imgsrc="http://www.baidu.com.cn/white.gif"/></p></body></html>形考任务31.XHTML指的是？A.EXtensibleHyperTextMarkupLanguageB.EX
tensibleHyperTextMarkingLanguageC.EXtremeHyperTextMarkupLanguageD.EXtraHyperlinksandTextMarkupLanguage2.在下面的XHTML中，哪个可以正确地标记段落？A.<p></p>B.<P></p>C.
<P></P>D.</p><p>3.在下面的XHTML中，哪个可以正确地标记折行？A.<br/>B.<break/>C.<br>4.下列XHTML中的属性和值，哪个是正确的？A.width="80"B.WIDTH="80"C.width=80D.
WIDTH=805.在XHTML文档中哪些元素是强制性的？A.doctype、html、head以及bodyB.doctype、html、head、body以及titleC.doctype、html以及body6.下列哪些是格式良好的XHTML？A.<p>A<b><i>short
</i></b>paragraph</p>B.<p>A<b><i>short</b></i>paragraph</p>C.<p>A<b><i>short</i></b>paragraph7.在XHTML中有哪些不同的DTD？A.S
trict,Transitional,LooseB.Strict,Transitional,Loose,FramesetC.Strict,Transitional,Frameset8.网页的主体内容将写在什么标签内部：A.<HTML>标签B.<body>标签C.<P>标签D.<HEAD>标
签9.HTML代码中，<align=center>表示A.文本加注下标线B.文本闪烁C.文本或图片居中D.文本加注上标线10.在HTML文档中使用有序列表应使用（）标记。A.<dl>B.<ul>C.<ol>D.<li>11.请判断以下说法是否正确：XHTML是一个Web标准。（√）1
2.请判断以下说法是否正确：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代码如下：<html><head></head><body><h1>这是标题1</h1><h2>这是标题2</h2><p>这是段落</p><pclass="">这个段落设置了内边距。</
p></body></html>活动2：使用百分比或者像素值设置行间距。HTML代码如下：<html><head></head><body><p>这是拥有标准行高的段落。在大多数浏览器中默认行高大约是110%到120%。这是拥有标准行高的段落。这是拥有标准行
高的段落。这是拥有标准行高的段落。</p><p>这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。</p><p>这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这
个段落拥有更大的行高。</p></body></html>参考答案<html><head><styletype="text/css">body{background-color:yellow}h1{background-color:#00ff00}h2{backgr
ound-color:transparent}p{background-color:rgb(250,0,255)}p.no2{background-color:gray;padding:20px;}</style></head><body><h1>这是标题1</h1><h2>这是标题2</h2><
p>这是段落</p><pclass="no2">这个段落设置了内边距。</p></body></html>（1）百分比<html><head><styletype="text/css">p.small{line-height:90%}p.big{line-height:200%}</st
yle></head><body><p>这是拥有标准行高的段落。在大多数浏览器中默认行高大约是110%到120%。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。</p><pclass="small">这个段落拥有更小的行高。这个段落拥有更小的行高。这
个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。</p><pclass="big">这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。</p></body></html>（2）
像素值<html><head><styletype="text/css">p.small{line-height:10px}p.big{line-height:30px}</style></head><body><p>这是拥有
标准行高的段落。在大多数浏览器中默认行高大约是20px。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。</p><pclass="small">这
个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。</p><pclass="big">这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的
行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。</p></body></html>形考任务5使用<div>元素以及CSS样式表对下面的内容进行的布局设计。城市介绍北京
上海南京南京简称“京”，是中华人民共和国的首都、直辖市、国家中心城市、超大城市、国际大都市，全国政治中心、文化中心、国际交往中心、科技创新中心，是中国共产党中央委员会、中华人民共和国中央人民政府、全国人民代表大会、中国人民政治协商会议全国委员会、中华人民共和国中央军事委员会所在地，也是中部战区司令
部驻地。北京位于华北平原北部，背靠燕山，毗邻天津市和河北省。北京的气候为典型的北温带半湿润大陆性季风气候。北京是首批国家历史文化名城和世界上拥有世界文化遗产数最多的城市，三千多年的历史孕育了故宫、天坛、八达岭长城、颐和园等众多名胜古迹。早在七十万年前，北京周口店地区就出现了原始人群部落“
北京人”。公元前1045年，北京成为蓟、燕等诸侯国的都城。公元938年以来，北京先后成为辽陪都、金中都、元大都、明、清国都。1949年10月1日成为中华人民共和国首都。参考答案<html><head><style>#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;}<
/style></head><body><divid="header"><h1>城市</h1></div><divid="nav">北京<br/>上海<br/>南京<br/></div><divid="section"><h2>London</h2><p>北京
，简称“京”，是中华人民共和国的首都、直辖市、国家中心城市、超大城市、国际大都市，全国政治中心、文化中心、国际交往中心、科技创新中心，是中国共产党中央委员会、中华人民共和国中央人民政府、全国人民代表大会、中国人民
政治协商会议全国委员会、中华人民共和国中央军事委员会所在地，也是中部战区司令部驻地。</p><p>北京位于华北平原北部，背靠燕山，毗邻天津市和河北省。北京的气候为典型的北温带半湿润大陆性季风气候。</p><p>北京是首批国家历史文化名城和世界上拥有世界文化遗产数
最多的城市，三千多年的历史孕育了故宫、天坛、八达岭长城、颐和园等众多名胜古迹。早在七十万年前，北京周口店地区就出现了原始人群部落“北京人”。公元前1045年，北京成为蓟、燕等诸侯国的都城。公元938年以来，北
京先后成为辽陪都、金中都、元大都、明、清国都。1949年10月1日成为中华人民共和国首都。</p></div></body></html>形考任务6HTML表单用于搜集不同类型的用户输入，包括文本输入、单选按钮输入、提交按钮，达到效果入下图所示。参考答案<form>登陆名称:<br
><inputtype="text"name="loginname"><br>密码:<br><inputtype="text"name="password">性别：<inputtype="radio"name
="sex"value="male"checked>男<br><inputtype="radio"name="sex"value="female">女<br><br><inputtype="submit"value="Submit"></form>形考任务71.讨论模版的使用要
点。（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库文件属性面板这样，原来的库文件区域就可以在网页中直接编辑了。在修改库文件之后，脱离库文件的网页也不会更新了。形考任务8HTML调用js实现多项滑动门选项卡特效。参考代码<!DOCTYPEhtmlPUB
LIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns
="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>js实现多项滑动门选项卡特
效</title><stylemedia="screen"type="text/css"></style><scripttype="text/javascript"language="javascript">//<!CDATA[function
g(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).class
Name='hovertab_zzjs';}//如果要做成点击后再转到请将<li>中的onmouseover改成onclick;//]]></script></head><body>你的代码</body></html>参考答案<!DOCTYPEhtmlP
UBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmln
s="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>js实现多项滑动门选项卡特效</title><styleme
dia="screen"type="text/css"></style><scripttype="text/javascript"language="javascript">//<!CDATA[func
tiong(o){returndocument.getElementById(o);}functionhover_zzjs_net(n){//如果有N个标签,就将i<=N;for(vari=1;i<=6;i++){g('tab_zzjs_'+i).cla
ssName='nor_zzjs';g('tab_zzjs_0'+i).className='undis_zzjs_net';}g('tab_zzjs_0'+n).className='dis_zzjs_net';g('tab_zzjs_'+n).classN
ame='hovertab_zzjs';}//如果要做成点击后再转到请将<li>中的onmouseover改成onclick;//]]></script></head><body><divclass="936_zzjs_net"><divid="tab_zzjs_"class="tab_z
zjs_"><ul><liid="tab_zzjs_1"class="hovertab_zzjs"onmouseover="x:hover_zzjs_net(1);">一、内容</li><liid="tab_zzjs_2"class="nor_zzj
s"onmouseover="i:hover_zzjs_net(2);">二、内容</li><liid="tab_zzjs_3"class="nor_zzjs"onmouseover="a:hover
_zzjs_net(3);">三、内容</li><liid="tab_zzjs_4"class="nor_zzjs"onmouseover="o:hover_zzjs_net(4);">四、内容</li>
<liid="tab_zzjs_5"class="nor_zzjs"onmouseover="g:hover_zzjs_net(5);">五、内容</li><liid="tab_zzjs_6"class="nor_zzjs"onmouseover="z:hover_z
zjs_net(6);">六、内容</li></ul></div><divclass="ctt_zzjs_net"><divclass="dis_zzjs_net"id="tab_zzjs_01"><href="#">一、内容</a>，测试内
容一！</div><divclass="undis_zzjs_net"id="tab_zzjs_02"><href="#">二、内容</a>，测试内容二！</div><divclass="undis_zzjs_net"id="tab_zzjs_03"><href="#">三、内容<
/a>，测试内容三！</div><divclass="undis_zzjs_net"id="tab_zzjs_04"><href="#">四、内容</a>，测试内容四！</div><divclass="undis_z
zjs_net"id="tab_zzjs_05"><href="#">五、内容</a>，测试内容五！</div><divclass="undis_zzjs_net"id="tab_zzjs_06"><href="#">六、内容</a>，测试内容六！</div
></div></div></div></body></html>形考任务91、为什么要进行网站的测试？参考答案：无论是编程还是制作站点，测试工作都是不可或缺的步骤。有很多理由让用户测试自己的站点，例如不同浏览器能否浏览网站、不同显示分辨率的显示器能否显示网站、站点中有没有断开的链接等都需
要进行测试。2.多人协同工作制作一个网站时，最好使用Dreamweaver的什么功能？参考答案：当我们工作在一个开发小组中的时候，【取出】和【存回】功能就显得尤为重要。因为它可以提示其他小组成员或者作者自己，不要修改已有
新版本而未上传的页面。
辽公网安备 21102102000191号
营业执照
