当前位置：文档之家› 网页制作操作步骤之一

网页制作操作步骤之一

国家职业资格鉴定

《网页设计制作员》（中级/四级）试卷

注意事项：

1、在R盘新建一个考生文件夹，其文件夹名为：机号+网页设计制作员+考生准考证号最

后五位（例：01网页设计制作员90001），考生所做的结果必须保存在该考生文件夹内。

考试过程中应注意经常保存文件。

2、考试所需素材在S盘：\网页设计制作员素材文件夹内。

3、答题以试题文字要求为准，样张仅供参考。

4、试卷不得带走，否则考试成绩做无效处理。

一、设计制作网页内容文字和图表效果：共20分。（题库1.1.1试题单）

1. 在R:\ 01网页设计制作员90001目录下新建1.1.1文件夹。

2. 把素材库文件夹“网页设计制作员素材\1.1.1”内的“1.1.1.2文件夹”中的zc.htm和images文件夹复制到R:\ 01网页设计制作员90001文件夹中。打开素材库文件夹“网页设计制作员素材\1.1.1”内的样张“1.1.1.1.bmp”。

3. 用Dreamweaver8.0打开R盘（考生目录1.1.1文件夹下）的zc.htm文件，

2种打开文件的方式：1）打开Dreamwaever8.0软件，菜单里选择打开，选择zc.htm文件。

2）右击zc.htm文件，“使用Dreamweaver 8编辑”。

4. 在适当位置插入图片zc-1.gif,并在“替换”中键入“用户注册”（添加注释）；如下图：

5. 在用户注册后的两列中设置背景图片为zc-4.gif，如下图：

6. 在CSS浮动面板中新建CSS规则，名称自定（如ziti），单选按钮选“仅对该文档”（内部标签）；如下图：

在类型中选择 a）大小：12像素；b)行高：2倍行高；

7. 按样张填入表单对象、文字，并设置CSS样式。

8. 布局表格内适当位置添置按钮对象，值为“检查会员名是否…”，并设置表单对象的动作属性为无；如下图：

9. 布局表格内适当位置添置按钮对象，值为“同意以下服务条款…”，表单对象的动作属性为“提交”；如下图:

10. 为文本“推荐：QQ邮箱”设置链接“https://www.doczj.com/doc/6214433450.html,”，为“sogou邮箱”设置链接“https://www.doczj.com/doc/6214433450.html,”；如下图：

11. 保存文件zc.html，注意一定要保存至到考试盘R盘R:\ 01网页设计制作员90001目录下的1.1.1文件夹内。

二、制作Gif动画：共15分。（题库1.2.1试题单）

1. 在R:\ 01网页设计制作员90001目录下新建1.

2.1文件夹。

2. 打开Fireworks8.0软件，新建Fireworks文档，宽度710像素，高度160像素，画布选择自定义的黑色；如下图：

3. 使用文本工具键入“loading……”，设置文本字体属性：字体“Arial”、字体大小为“18”，白色，加粗；并调整至适当的位置。

4. 在新建的动画文档中绘制白色矩形，具体要求：a)大小：1像素×45像素；b)位置（80，40）。

5．选中矩形，在“帧”浮动窗口的右上角“选项中”选择“重制帧”，如下图：

6. 在第2帧中修改矩形宽度为40像素，再重制一帧宽度改为80，依次重制到12帧，每帧宽度增加40左右，最后一帧的宽度设为450。如下图：

7. 打开“历史记录”浮动窗口，框选所有的记录，按右下角保存为命令，名称为“1.2.1”。

8. 优化浮动窗口中选择“动画gif”，导出为1.2.1.gif，保存至R盘的1.2.1文件夹。

9. 保存文档为1.2.1.png文件，保存至R盘的1.2.1文件夹。

三、设计制作网页动态效果：共15分。（题库1.4.1试题单）

1. 在R:\ 01网页设计制作员90001目录下新建1.4.1文件夹。

2. 打开Dreamweaver8.0软件，新建2个空白页（基本页），另存到 1.4.1文件夹，一个文件名为“1.4.1.html”，另外一个文件名任意（例如aa.html）。

在aa.html中复制入文字“欢迎光临淘淘乐网站，祝您购物愉快”，字体，大小，颜色任意，标题任意。

3. 打开“标签检查器”浮动窗口，选择“行为”选项卡，添加行为->设置文本->设置状态栏文本->其中键入或复制文字“欢迎光临淘淘乐网站，祝您购物愉快”；如下图:

4. 继续添加行为->打开浏览器窗口->要显示的URL中选aa.html文件->窗口宽度和高度建议设置200（也可任意选择，不要太大）；如下图:

5. 保存并浏览文件。

五、制作网站主要页面：共40分。（题库1.7.1试题单）

1.在R盘新建一个考生文件夹，其文件夹名为：机号+网页设计制作员+考生准考证号最后五位（例：01网页设计制作员90001），考生所做的结果必须保存在该考生文件夹内。考试过程中应注意经常保存文件。

2. 在R:\ 01网页设计制作员90001目录下新建1.7.1文件夹。

3. 在1.7.1文件夹中新建images目录。

4. 打开Dreamweaver8.0软件，选择“菜单”中的“站点”->新建站点->“站点名称”填入“SweetWedding1.7.1”（也可任意设置，不能与其他题目相同）->站点根文件夹选择R: \01网页设计制作员90001\1.7.1这个目录，勾选“自动刷新本地文件列表”，如下图：

5. 打开S:\网页设计制作员素材中的1.7.1文件夹，右击1.7.1.1.bmp文件->Edit with FireWorks，参照1.7.1.2.bmp的要求，在Firewoks8.0中对图片进行切片：

可在切片属性中设置宽和高；每个切片务必在类型下的格式中选择Gif接近网页256色格式，如下图：（如果是BMP格式将无法在Dreamweaver8.0界面中显示）

选择“文件”菜单中的“导出”，“保存在”设置为1.7.1文件夹，文件名设置为index，类型HTML和图像，勾选“将图像放入子文件夹”，按“保存”，如下图：

在Dreamweaver8.0软件的站点文件中可看到如下文件列表，如下图：

6. 在Dreamweaver8.0软件“文件”浮动窗口下的“SweetWedding1.

7.1”站点根目录下，右击“新建文件”，名称改为“comintro.html”(选中文件后按F2重命名)，并双击打开，在编辑界面键入“公司介绍”四个字，如下图：

选中文字，属性中设置链接文件为index.htm,如下图：

7. 如第6步，在Dreamweaver8.0软件“文件”浮动窗口下的“SweetWedding1.7.1”站点根目录下，右击“新建文件”，名称改为“wedserv.html” (选中文件后按F2重命名)，并双击打开，在编辑界面键入“婚庆服务”四个字；选中文字，属性中设置链接文件为index.htm。

8. 如第6步，在Dreamweaver8.0软件“文件”浮动窗口下的“SweetWedding1.7.1”站点根目录下，右击“新建文件”，名称改为“wedbook.html” (选中文件后按F2重命名)，并双击打开，在编辑界面键入“结婚手册”四个字，选中文字，属性中设置链接文件为index.htm。

9. （a）选择如下区域图片，在“公司介绍”部分，制作热点链接，链接文件为comintro.html,目标选择“_self”,表示在当前页打开链接页面，如下图：

（b）选择如下区域图片，在“婚庆服务”部分，制作热点链接，链接文件为wedserv.html,目标选择“_blank”,表示在新窗口打开链接页面。

（C）选择如下区域图片，在“结婚手册”部分，制作热点链接，链接文件为wedbook.html,目标选择“_blank”,表示在新窗口打开链接页面。

（d）为“首页”图片建立空链接“#”，如下图：

（e）为“登陆”图片建立空链接“#”，如上图：

（g）为“联系我们”图片建立邮件链接，为“mailto:sweetwedding@https://www.doczj.com/doc/6214433450.html,”。（注意使用英文冒号:）

10. a）在Dreamweaver8.0软件“文件”浮动窗口下的“SweetWedding1.7.1”站点根目录下，右击“新建文件”，文件名改为“bbs_top.html” (选中文件后按F2重命名)，并双击打开，在编辑界面键入“bbs_top”。

b）在Dreamweaver8.0软件“文件”浮动窗口下的“SweetWedding1.7.1”站点根目录下，右击“新建文件”，文件名改为“bbs_left.html” (选中文件后按F2重命名)，并双击打开，在编辑界面键入“bbs_left”。

C）在Dreamweaver8.0软件“文件”浮动窗口下的“SweetWedding1.7.1”站点根目录下，右击“新建文件”，文件名改为“bbs_main.html” (选中文件后按F2重命名)，并双击打开，在编辑界面键入“bbs_main”；把s盘素材文件目录1.7.1文件夹下的1.7.1.3.swf复制到images目录，并在bbs_main.html 中插入此flash文件。

11. a）文件菜单->新建框架集->上方固定，左侧嵌套（T字型）；

b）建立好框架以后马上在“文件”菜单中选择“框架集另存为”，把框架集另存在SweetWedding1.7.1根目录下，文件名为为bbs.html。

c）打开框架浮动窗口，选中topFrame区域，打开“标签”浮动窗口，在“CSS/辅助功能”项中把id 改为top，回车确认（框架名称改为top）；如下图：

分别设置其他两个区域的的框架id名称为left和main。

d）分别选中框架浮动菜单中的3个区域，设置3个区域的源文件为bbs_top.html,bbs_left.html和bbs_main.html。如下图：

e）选中bbs_top.html文件中的文字，链接到文件index.htm,目标中选择“main”；如下图：

f）选中横向的框架分割线，属性中选择上方区域，行设置为120像素；如下图：

下方区域行设置为308像素。

g）选中竖向的框架分割线，属性中选择左面区域，列设置为150像素；如下图：

右面区域设置为578像素。

11. 右击上方文件列表条，保存全部，并在IE中浏览（快捷键F12）。

网页制作考试试题(带答案)

1.HTMl是指（A）。 A.超文本标签语言 B. 汇编语言 C. 服务端端语言 D.脚本语言 2.HTML 文件必须使用htm 或者（B）作为文件扩展名。 A.aspx B. html C. jsp D. doc 3.WWW是（B）的意思。 A．网页B．万维网C．浏览器D．超文本传输协议 4.在网页中显示特殊字符，如果要输入“<”，应使用（D）。 A．lt; B．≪ C．< D．< 5.以下说法中，错误的是：（D）。 A．获取WWW服务时，需要使用浏览器作为客户端程序。 B．WWW服务和电子邮件服务是Internet提供的最常用的两种服务。 C．网站就是一系列逻辑上可以视为一个整体的页面的集合。 D．所有网页的扩展名都是.htm。 6.以下说法中，错误的是：（B）。 A．网页的本质就是HTML源代码。 B．网页就是主页。 C．使用“记事本”编辑网页时，通常应将其保存为.htm 或.html 后缀。 D．本地网站通常就是一个完整的文件夹。 7.浏览网页时，通常使用以下协议：（C）。 A．mailto B．FTP C．HTTP D．TCP/IP 8.在网页中显示特殊字符，如果要输入空格，应使用（D）。 A．nbsp; B．&Nbsp; C． D． 9.以下软件中，不能直接用来编辑HTML 文件的是：（C）。 A．记事本B．FrontPage C．Flash D．Dreamweaver 10.以下有关HTML 标记符的属性的说法中，错误的是：（C）。 A．在HTML中，所有的属性都放置在开始标记符的尖括号里。 B．属性与HTML标记符的名称之间用空格分隔。 C．属性的值放在相应属性之后，用等号分隔；而不同的属性之间用分号分隔。 D．HTML 属性通常也不区分大小写。二、填空题 1.如果要为网页指定黑色的背景颜色，应使用以下html语句：。 2.上网浏览网页时，应使用_____浏览器____作为客户端程序。 3.TITLE 标记符应位于___head______标记符之间。 4.要设置网页在黑色背景下显示白色文字，应使用__语句。 5.要设置整个网页的背景颜色，应在body标记符中设置____bgcolor_____属性。三、判断题 1.用H1标记符修饰的文字通常比用H6标记符修饰的要小。╳ 2.B标记符表示用粗体显示所包括的文字。√ 3.指定滚动字幕时，不允许其中嵌入图象。╳ 4.指定水平线粗细的属性是size。√ 5.指定水平线粗细的属性是width。╳

个人网页制作全过程

个人网页制作全过程 [日期：10-12] 来源：作者：[字体：大中小] 如何制作个人网页全过程，送给刚学做网页的朋友们第一讲网页的基本知识和FrontPage入门一、网页的基本知识 1、网站与网页我们在因特网上浏览时，看到的每一个页面，称为网页，很多网页组成一个网站。一个网站的第一个网页称为主页。主页是所有网页的索引页，通过单击主页上的超链接，可以打开其他的网页。正是由于主页在网站中的特殊作用，人们也常常用主页指代所有的网页，将个人网站称为“个人主页”，将建立个人网站称为“网页制作”。 2、怎么建立个人网站？要建立一个个人网站，必须经过网页制作、网站（页）发布和网站维护三个阶段 1）网页制作一个网站和一本杂志一样，都是展示信息的载体，只有能提供他人需要信息（内容）的网站才能吸引他人访问。这些都要靠制作有内容的网页来完成。确定网站主题和后，制作网页是建立个人网站的首要工作。每个网页基本上都是一个HTML(Hyper Text Markup Language，即超文本标识语言)文件，所以网页文件的扩展名一般是.HTM或.HTML。主页文件的文件名字index.htm或index.html。一般在电脑上写文章使用Word、Wps等文字处理软件，而制作网页则可使用Frontpage等网页制作工具。 2）网页发布做好的网页必须发布到因特网上，才能被大家看到。所谓发布到因特网上实际上就是将网页文件放到始终与因特网联机的计算机上，这种计算机被称为“服务器”。实际上家里的PC机安装相应的服务器软件且有固定的IP地址也可以做服务器，但一般都借用单位网站的服务器或租用一些空间提供商的服务器空间。这就和你要开商店必须租用一个场地一样。 3）网站维护网页发布后就可供大家访问了，不管在什么地方，只要是与和因特网相连的计算机都可以访问到你的网页。但这没有万事大吉。就和报纸、杂志一样，总是老内容，也就没人来访问了。需要经常更新，补充新内容。另外网页上的错误也需要及时改正。实际上网站维护是网站建设的主要工作量。 2、什么软件可以做网页？假如，你熟悉文字处理的相关软件，你不用专用软件，也可以作出网页来。比如，用Word，用Wps，甚至用你计算机附件自带的记事本也行。不过用Word做出来的网页体积太大，用记事本做网页则要会用一些HTML语言，而用HTML来制作网页是一件非常麻烦的事。FrontPage等网页制作工具则使我们可以不必和这些难记、难懂的HTML代码打交道就作出较好的网页来。初学的人，用微软公司的frontpage比较好，它的优点是易学易懂，上手快。FrontPage是微软公司Office系列办公软件中的一个，它很好地实现了主页制作者与HTML的分离。就像在Word中编辑文本一样，我们只需要在编辑器中输入文本或图片，并设置好格式，很快就可以作出一个简单的网页了。除了Frontpage以外，还有许多制作网页的软件，如Hotdog等，其中最著名的是Macromedia公司的“网页三剑客”即Dreamweaver（网页制作工具）、Flash（动画制作工具）和Fireworks（图像编辑工具）。假如，你有了一定基础，还是用“网页三剑客”好。它们是专用的网页制作软件，用它们制作的网页，体积小，占用资源少，兼容性好。所以本讲座也从FrontPage入手学习网页制作。大家先学好FrontPage，打好基础，如果将来准备

网页设计大作业word模板

伊犁师范学院《网页设计》期末课程设计设计题目：我的个人网页学号：018 姓名：马建武院系：电子与信息工程学院专业班级：计科08-2 指导老师：王雪峰日期：2011-6-20

一、设计思想随着网络技术的飞速发展，网络已经遍及每个人的身边，通过个人网页把自己展示在网络上，不仅可以获得更多的朋友，有用的信息，也是跟随时代发展，做走在时代前沿的一个有效方式，本网站旨在设计一个个性化的个人网站，展现自己的生活，学习，爱好等等信息，通过本网站把自己展示出来。二、开发环境及软件 Windows XP，Macromedia Dreamweaver 8，photoshop等三、系统结构功能图、页面结构草图及部分页面截图四、部分代码（主要添加CSS代码） 1.添加首页背景音乐 2.运用框架