国家开放大学《Dreamweaver网页设计》形考任务1-9参考答案_第1页
国家开放大学《Dreamweaver网页设计》形考任务1-9参考答案_第2页
已阅读5页，还剩17页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、国家开放大学Dreamweaver网页设计形考任务1-9参考答案形考任务11、网页的内容应该包括哪些元素？参考答案： 文本、图片和动画、声音和视频、超链接、表格、表单、导航栏等其它常见元素。2、一般网站的规划与设计应该考虑哪些因素？参考答案：(1)清晰的网站目标定位你明确了目标，就好像在茫茫大海中寻找到了前进的方向。避免走过多的弯路。只有选择正确了，才会有好的结果。（2）注册域名找准了方向以后，就要选择一个好记忆的域名让用户轻易的记住你的网站，方便下次访问。这也是很关键的一步。（3）服务器的选择服务器关系着网站的后期发展。好的服务器你可以放心的做网站运营推广，这远比选一个安全等等各方面做得不太

2、好的空间强得多，起码你不用顾虑那么多。（4）网站的制作建议在做网站建设要根据自己的实际情况出发，量身定制自己的网站。网站后台的制作网站的操作后台一点要简洁，便利。网站结构的设计这点比较重要，一个网站做出来，一定要有合理的结构布局，一方面提高用户体验，一方面方便搜索引擎蜘蛛爬行。（5）网站推广站做好了以后就要把它推广出去，让更多的人认识了解我们这个站。推广方法有很多，可以到各大论坛博客推广，百度竞价，QQ推广等等。3、商业网站在规划与设计时应着重考虑哪些因素？参考答案： 内容、易用、美观、交互。形考任务2（1）通过使用 HTML，可以在文档中显示图像，插入一副图像（jpg）、插入一副动图图像（g

3、if格式）。（2）从不同位置，包括文件夹和网络，插入图像。参考答案（1）<html><head></head><body><p>一幅图像：<img src="/i/eg_mouse.jpg" width="128" height="128" /></p><p><img src="/i/eg_cute.gif" width="50" height="50" /></

4、p><p>请注意，插入动画图像的语法与插入普通图像的语法没有区别。</p></body></html>（2）<html><head></head><body><p>来自另一个文件夹的图像：<img src="/i/abc.jpg" /></p><p>来自 网络的图像：<img src=" /></p></body></html>形考任务31.XHTML 指的是？A. E

5、Xtensible HyperText Markup LanguageB. EXtensible HyperText Marking LanguageC. EXtreme HyperText Markup LanguageD. EXtra Hyperlinks and Text Markup Language2.在下面的 XHTML 中，哪个可以正确地标记段落？A. <p></p>B. <P></p>C. <P></P>D. </p><p>3.在下面的 XHTML 中，哪个可以正确地标记折行？A.

6、<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

7、</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. Strict, Transitional, LooseB. Strict, Transitional, Loose, FramesetC. Strict, Transitional

8、, 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 标准。（）12.请判断以下说法是否正确：XML 和 HTML

9、 会被 XHTML 取代。（）13.请判断以下说法是否正确：HTML 会被 XHTML 取代。（）14.请判断以下说法是否正确：XHTML 中所有的元素都需要关闭。（）15.请判断以下说法是否正确：DOCTYPE 没有关闭标签。（）16.请判断以下说法是否正确：XHTML 文档必须是格式良好的。（）17.在 XHTML 中允许简写属性吗？（×）18.所有的 XHTML 文档都需要 doctype 吗？（）19.请判断以下说法是否正确：所有的 XHTML 标签和属性都必须是小写的。（）20.请判断以下说法是否正确：HTML 5 是 XHTML 的升级版本。（×）形考任务4活动

10、1：采用CSS样式来设置背景、标题和段落的颜色。HTML代码如下：<html><head></head><body><h1>这是标题 1</h1><h2>这是标题 2</h2><p>这是段落</p><p class=" ">这个段落设置了内边距。</p></body></html>活动2：使用百分比或者像素值设置行间距。HTML代码如下：<html><head></head>

11、;<body><p>这是拥有标准行高的段落。在大多数浏览器中默认行高大约是 110% 到 120%。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。</p><p>这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。</p><p>这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。</p></body></html>参考答案<

12、html><head><style type="text/css">body background-color: yellowh1 background-color: #00ff00h2 background-color: transparentp background-color: rgb(250,0,255)p.no2 background-color: gray; padding: 20px;</style></head><body><h1>这是标题 1</h1><h2&g

13、t;这是标题 2</h2><p>这是段落</p><p class="no2">这个段落设置了内边距。</p></body></html>（1）百分比<html><head><style type="text/css">p.small line-height: 90%p.big line-height: 200%</style></head><body><p>这是拥有标准行高的段落。在大多数

14、浏览器中默认行高大约是 110% 到 120%。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。</p><p class="small">这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。</p><p class="big">这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。</p></body></html>

15、（2）像素值<html><head><style type="text/css">p.small line-height: 10px p.big line-height: 30px </style></head><body><p>这是拥有标准行高的段落。在大多数浏览器中默认行高大约是 20px。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。这是拥有标准行高的段落。</p><p class="small"&

16、gt;这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。这个段落拥有更小的行高。</p><p class="big">这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。这个段落拥有更大的行高。</p></body></html>形考任务5使用 <div> 元素以及CSS样式表对下面的内容进行的布局设计。城市介绍北京上海

17、南京南京简称“京”，是中华人民共和国的首都、直辖市、国家中心城市、超大城市、国际大都市，全国政治中心、文化中心、国际交往中心、科技创新中心，是中国共产党中央委员会、中华人民共和国中央人民政府、全国人民代表大会、中国人民政治协商会议全国委员会、中华人民共和国中央军事委员会所在地，也是中部战区司令部驻地。北京位于华北平原北部，背靠燕山，毗邻天津市和河北省。北京的气候为典型的北温带半湿润大陆性季风气候。北京是首批国家历史文化名城和世界上拥有世界文化遗产数最多的城市，三千多年的历史孕育了故宫、天坛、八达岭长城、颐和园等众多名胜古迹。早在七十万年前，北京周口店地区就出现了原始人群部落“北京人”。公元前1

18、045年，北京成为蓟、燕等诸侯国的都城。公元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:3

19、50px;float:left;padding:10px;#footer background-color:black;color:white;clear:both;text-align:center;padding:5px;</style></head><body><div id="header"><h1>城市</h1></div><div id="nav">北京<br />上海<br />南京<br /></div

20、><div id="section"><h2>London</h2><p>北京，简称“京”，是中华人民共和国的首都、直辖市、国家中心城市、超大城市、国际大都市，全国政治中心、文化中心、国际交往中心、科技创新中心，是中国共产党中央委员会、中华人民共和国中央人民政府、全国人民代表大会、中国人民政治协商会议全国委员会、中华人民共和国中央军事委员会所在地，也是中部战区司令部驻地。</p><p>北京位于华北平原北部，背靠燕山，毗邻天津市和河北省。北京的气候为典型的北温带半湿润大陆性季风气候。</p&g

21、t;<p>北京是首批国家历史文化名城和世界上拥有世界文化遗产数最多的城市，三千多年的历史孕育了故宫、天坛、八达岭长城、颐和园等众多名胜古迹。早在七十万年前，北京周口店地区就出现了原始人群部落“北京人”。公元前1045年，北京成为蓟、燕等诸侯国的都城。公元938年以来，北京先后成为辽陪都、金中都、元大都、明、清国都。1949年10月1日成为中华人民共和国首都。</p></div></body></html>形考任务6HTML 表单用于搜集不同类型的用户输入，包括文本输入、单选按钮输入、提交按钮，达到效果入下图所示。参考答案<for

22、m>登陆名称:<br><input type="text" name="loginname"><br>密码:<br><input type="text" name="password">性别：<input type="radio" name="sex" value="male" checked>男<br><input type="radio"

23、 name="sex" value="female">女<br><br><input type="submit" value="Submit"></form>形考任务71.讨论模版的使用要点。（1）包括网页中应用模版的方法参考答案：（1）直接创建模板（2）将普通网页另存为模板（3）从文件菜单新建模板（2）如何将当前设计好的页面转换为模板参考答案：建立模板的另一种方法是将普通网页另存为模板，具体如下：（1）打开一个已经制作完成的网页（如图7.7所示），删除网页中存

24、在差别的区域，保留相同的区域。如图7.8所示。图7.7 制作完成的网页图7.8 删除网页中存在差别的区域，保留相同的区域（2）选择【文件】|【另存为模板】将网页另存为模板。（3）在如图7.9所示的【另存模板】对话框中，【站点】下拉列表框用来设置模板保存的站点，可选择一个选项。【现存的模板】选框显示了当前站点中的所有模板。【另存为】文本框用来设置模板的命名。单击【另存模板】对话框中的【保存】按钮，将把当前网页转换成模板，同时将模板另存到选择的站点中。图7.9 另存模板（4）单击【保存】按钮，保存模板。系统将自动在根目录下创建Template文件夹，并将创建的模板文件保存在该文件夹中。窗口的左上角

25、会出现模板的名称。如图7.10所示。图7.10 保存的模板图7.11 警告信息（3）如何使用模板生成多个页面参考答案：模板可被理解成一种模型，用这个模型可以方便地做出很多页面，然后在此基础上可以对每个页面进行改动，加入个性化的内容。为了统一风格，一个网站的很多页面都要用到相同的页面元素和排版方式，使用模板可以避免重复地在每个页面输入或修改相同的部分，等网站改版的时候，只要改变模板这个文件的设计，就能自动更改所有基于这个模板的网页。可以说，模板最强大的用途之一就在于一次更新多个页面。从模板创建的文档与该模板保持连接状态（除非用户以后分离该文档），可以修改模板并立即更新基于该模板的所有文档中的设计

26、。2.如何在网页中应用库（1）如何网页中建立库参考文件：（1）单击资源面板库分类上的新建按钮，新的库文件出现在窗口之中，给新库文件命名。如图7.41所示。图7.41 新建库文件（2）双击新建的库文件，打开库文件编辑窗口。如图7.42所示。图7.42 库文件编辑窗口提示：库文件实际上是要插入在网页中的一段代码，所以库文件的编辑窗口，除不可以设置页面属性外，其他和普通网页的编辑方式一样。（3）选择【文件】|【保存】，保存库文件。Dreamweaver将把库的项目文件保存在站点本地文件夹下的Library子文件夹里，保存为.lbi文件。如果本地站点没有这个子文件夹，Dreamweaver将自动生成这

27、个子文件夹。（2）如何插入库、选择内容转换为库参考答案：刚刚创建好库文件后，对于转换成库文件的内容，网页中已经拥有了这个库文件。即背景会显示为淡黄色，不可编辑。如图7.44所示。图7.44 页面中的库文件对于新建立的库文件，如果希望在网页中插入库文件，操作如下：（1）将光标放置在网页中要插入库文件的位置。（2）在文件管理器中，选中要插入的库文件，选择窗口下方的【插入】按钮。 插入到网页中的库文件背景同样会显示为淡黄色，同样是不可编辑的。（3）如何将库内容插入多个文档参考答案：选中网页上插入的库文件上，在属性面板中选择【从源文件中分离】。如图7.47所示。图7.47 库文件属性面板这样，原来的库

28、文件区域就可以在网页中直接编辑了。在修改库文件之后，脱离库文件的网页也不会更新了。形考任务8HTML 调用js实现多项滑动门选项卡特效。参考代码<!DOCTYPE html PUBLIC "-/W3C/DTD XHTML 1.0 Transitional/EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-e

29、quiv="Content-Type" content="text/html; charset=gb2312" /><title> js实现多项滑动门选项卡特效</title><style media="screen" type="text/css"></style><script type="text/javascript" language="javascript">/<!CDATAfunction

30、g(o) return document.getElementById(o); function hover_zzjs_net(n) /如果有N个标签,就将i<=N;for (var i = 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

31、9; g('tab_zzjs_' + n).className = 'hovertab_zzjs'/如果要做成点击后再转到请将<li>中的onmouseover 改成 onclick;/></script></head><body>你的代码</body></html>参考答案<!DOCTYPE html PUBLIC "-/W3C/DTD XHTML 1.0 Transitional/EN" "/TR/xhtml1/D

32、TD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title> js实现多项滑动门选项卡特效</title><style media="screen" type="text/css&q

33、uot;></style><script type="text/javascript" language="javascript">/<!CDATAfunction g(o) return document.getElementById(o); function hover_zzjs_net(n) /如果有N个标签,就将i<=N;for (var i = 1; i <= 6; i+) g('tab_zzjs_' + i).className = 'nor_zzjs' g(&#

34、39;tab_zzjs_0' + i).className = 'undis_zzjs_net' g('tab_zzjs_0' + n).className = 'dis_zzjs_net' g('tab_zzjs_' + n).className = 'hovertab_zzjs'/如果要做成点击后再转到请将<li>中的onmouseover 改成 onclick;/></script></head><body><div class="

35、936_zzjs_net"><div id="tab_zzjs_" class="tab_zzjs_"><ul><li id="tab_zzjs_1" class="hovertab_zzjs" onmouseover="x:hover_zzjs_net(1);">一、内容</li><li id="tab_zzjs_2" class="nor_zzjs" onmouseover=&quo

36、t;i:hover_zzjs_net(2);">二、内容</li><li id="tab_zzjs_3" class="nor_zzjs" onmouseover="a:hover_zzjs_net(3);">三、内容</li><li id="tab_zzjs_4" class="nor_zzjs" onmouseover="o:hover_zzjs_net(4);">四、内容</li><li id="tab_zzjs_5" class="nor_zzjs" onmouseover="g:hover_zzjs_net(5);">五、内容</li><li id="tab_zzjs_6" class="nor_

人人文库> 全部分类> 教育资料 > 考试试卷

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论