网页制作教程指导
第一章网页设计基础
教学目的：
本章将带领用户认识Dreamweaver MX，了解其新增功能。在开始学习该软件之前，了解一下Dreamweaver MX 的工作界面的一些简单设置。通过本章的学习，用户能熟悉Dreamweaver MX的工作界面，并能自行设置具有独特的个性化的工作环境。理解DW站点的作用，并掌握建立站点的方法及站点维护的方法。
教学重点：
1、认识Dreamweaver MX。
2、新增功能。
3、Dreamweaver MX主窗口。
4、自定义工作环境。
5、利用Dreamweaver建立站点的方法
教学难点：
1、认识Dreamweaver MX。
2、新增功能。
3、自定义工作环境。
教学方法：讲演法
教学课时：2课时
教学内容与教学过程：
一、介绍网页制作这门课程
1．学习这门课程的目的：让学生掌握HTML语言、以及利用相关网页制作工具制作网页的基本方法与技能。学生通过这门课程的学习，能够具备综合运用专业软件进行小型网站开发和静态网页页面设计的能力，同时积累一定的实践经验，为今后从事相应的网站设计制作工作打下良好基础。
2．这门课程的教学内容：在制作软件上：以网页制作软件DreamWeaver MX为主干进行网页制作教学，同时选择了Flash MX版本来制作网页中的动画素材，选择了图形图像工具Photoshop 7.0版本软件来处理和制作网页中的图片。教学内容安排上按照学生学习网页的渐进规律划以及学校制订的计划主要学习第1、2、3、5、6、9章，主要包括网页制作的基础知识、Dreamweaver MX软件的使用，初学者利用现有的素材设计制作出一个简单的网页；利用Photoshop7和Flash MX软件来美化网页，以及网页布局和用色方面的美术知识，如何设计网页的版面和结构，还要能对供给的素材按照网站的特点进行适当的美化处理；还能掌握中小型网站的建立方法。
3．这门课程的教学和学习方法：教学上以一个个案例为基础，采用项目教学的方法，由浅入深的介绍网页制作的各个知识点；教学中以学生会操作为目的，重视学生动手能力和自学能力的培养同学们学习时除了要掌握相应的操作技能以外，更要重视操作技能的使用，要努力完成每章教学案例的制作以及课后素材案例。在不断的练习过程中熟悉和升华所学的操作技能。同时，要学会学习，即要学会与老师或同学之间技术心得的交流，要学会能自主的依靠其他资源（网络、报纸杂志等）来扩展所学的知识体系。
课前思考：
1、Dreamweaver软件是干什么用的？
2、试用一下Dreamweaver，你觉得这个软件在界面上更象Word还是Photoshop，为什么？
3、试用一下Dreamweaver，按默认格式保存，文件的扩展名是什么？
4、双击网页文件，会自动打开Dreamweaver软件吗？这点上与Word软件相同吗？
1.1 Dreamweaver的基本概念
1、了解Dreamweaver与IE有什么区别？
Dreamweaver是制作网页的工具，用它可以生成.htm或.html文件，而IE是浏览网页的工具，用IE只能看网页，而不能改网页，修改网页还是需要网页制作工具。
2、做网页只能使用Dreamweaver一种工具吗？
常用的网页制作软件有Dreamweaver和FrontPage。Dreamweaver由美国Macromedia公司开发，虽然初学者感到比较难学，但它的功能更强大，生成的网页代码质量好，是当今最流行的网页制作工具，适合专业网页设计人员使用，近年来它还获得过不少大奖呢。Frontpage是微软公司开发的Office办公软件中的一部分，比较容易上手，但功能不太强大，我们只在需要时（如向网页中加入微软格式的视频），才会使用FrontPage。
3、Dreamweaver最新版是多少？
Dreamweaver从2.0、3.0、4.0、MX到现在最新的MX2004版，平均每过一年就出一个新版。可见计算机是多么的富有活力。今年常用的是MX版，建议大家在家里的电脑上也将这个版本，以便与学校的相同。对于软件，我并不认为版本越新越好，它们的基本功能还是相同的，一般版本越高，对计算机的要求也越高，如果计算机配置不高，初学时还是找个低版本比较好，当然所装的软件必须与书本上的相同，这也是学习其它软件的基本要求。
4、Dreamweaver与Firework、Flash有何关系？
它们都是Macromedia公司的软件，Dreamweaver是网页制作工具，Firework是图形处理工具，与photoshop相似，一般用于网页图形的制作，Flash是动画制作工具，在制作好的网页时，一般先用Firework和Flash先制作好网页中要用到的图形和动画素材，再用Dreamweaver把这些素材做成一张网页，只会Dreamweaver，不会图形处理和动画制作，是做不出好的网页的。有人把这三个软件称作网页设计“三剑客”。
1.2认识DreamWeaver
1.DreamWeaver的作用和特色
2.DreamWeaver功能界面的分解
3.DreamWeaver工作流程
4. DreamWeaver 的版本、安装、打开、保存等操作演示：练习制作第一张网页——作业一在主窗口中输入以下文字，并按以下格式排版，最后把文件以“学号姓名.htm”为名保存在桌面上。注意难点：设置字体、水平线、二个全角空格、回车会自动空一行，Shift+回车就不会空行了。
1.3 创建本地站点引入：为什么要建站点？在正式开始制作网页之前，最好先定义一个新网站，这是因为：
更好地利用站点窗口对站点文件进行管理。
尽可能的减少一些错误的出现，如路径出错，链接出错（特别是新手），当熟练掌握了DREAMWEA VER的使用后，并且只需制作单个网页时候可以省去这一步；
还值得说的是，新手做网页，就只知道做网页，不懂得条理性、结构性，一个文件放这里，另一个文件放那里，或者所有文件都放在同一文件夹内，这样显得很乱。
所以，行家的做法是：
（1先建立一个文件夹用于存放网站的所有文件，再在文件内建立几个文件夹，将文件分类，如图片文件放在image 文件夹内，HTML文件放在HTML文件夹内
（2）当然，如果站点比较大，文件比较多，可以先按栏目分类，在栏目里再分类。
（3）还有文件的命名也是非常重要的，新手通常不注意这些，随便乱起些名字，这样过些时候自己也搞不懂是什么了（特别是文件比较多的时候），我们要做到一看文件的名字就知道是什么内容的文件。
（4）行家的做法是：用英文或者拼音给文件命名（推荐英文），不要使用中文的名字（因为有的机器对中文支持不太好，有可能出现链接的错误，你自己以为正确的东西在别人看来有可能是错的）。1、什么是站点？站点是存放一组网页的一个存储地方，一般是一个磁盘目录，在该目录中存放该网站的所有网页及有关的图片、FLASH动画、CSS样式文件等。建立站点时，我们一般在自已的电脑上建一个文件夹，然后把制作的所有网页及图片放在此文件夹中，最后把这个目录上传到WEB服务器上，以供英特网上的所有用户浏览。问：网页＝？网站答：不等问：网页＝？主页答：不等主页通常主页命名为index.htm,index.html,default.htm,default.html2、站点的典型文件结构站点的典型文件结构3、如何建立一个空站点准备工作——建文件夹在硬盘上某一个位置建一个总的文件夹
My web
pic
music
flash
movie
……
例：在D盘上建立自己帐号为名的文件夹，把这个文件夹定义为站点，站点名的“我的个人网站”操作步骤：
第一步：在D盘上建立文件夹
第二步：在DW软件中，选择菜单“站点-新建站点”，可以按向导一步一步操作，但我建议大家直接选“高级”卡片
第三步：在“本地信息”中，填入“站点名称”，把“本地根文件夹”指定为该目录4、如何把一个已有目录定义为一个站点例：首先单击下载网站，把网站包下载到D盘，并解压缩，在D盘上会自动生成一个文件夹，按上面所讲的步骤，把该目录定义为一个站点，站点名为“祖国腾飞”5、使用站点管理器定义完站点后，就可以使用站点管理器来管理站点了。显示站点面板：单击菜单“窗口-站点”。我们可以在站点管理器中通过右击“新建文件夹”、“新建文件”、“文件重命名”、“删除文件”，也可以通过拖动，把文件移动到其它文件夹。
第二章网页的基本操作
教学目的：
使学生了解编辑HTML文档的各种具体操作，包括如何为页面添加文字，图片。
教学重点：
1、编辑文本的各种方法
2、在网页中插入图片的方法
教学难点：
1、编辑文本的各种方法
2、在网页中插入图片的方法
教学方法：讲演法
教学课时：4课时
教学过程：
2.1文本操作及修饰
一、特殊字符的输入
1、输入??? 等特殊英文字符
单击“插入”工具栏上的“字符”面板。
2、输入★?■△※↑①等中文符号
采用输入法中的软键盘
3、输入空格（推荐使用全角空格）
①单击“插入”菜单-“特殊符号”-“不换行空格”
②按“Ctrl+Shift+Space”组合键
③单击“插入”工具栏上的“字符”面板上的“不换行空格”按钮。
④把中文输入法切换到全角模式，输入全角空格
4、插入日期和时间。
单击“插入”工具栏上的“常用”面板上的“日期”按钮。
练习一：输入以下内容，以“1.htm”保存在桌面上。
特殊符号：??? ™ ±
中文符号：……℃?△※?▲
现在时间：2006-02-22
二、列表的制作
列表分为无序列表（项目列表）和有序列表（编号列表）；
各个列表项之间没有顺序级别之分时选无序列表，否则选有序列表。
制作方法：
第一步：先输入各个项目，每个项目成为一段（一个项目输入完成后，要按回车键，不能使用SHIFT＋回车）
第二步：选中要转换为项目列表的所有段落
第三步：单击属性面板上的项目列表或编号列表按钮
第四步：如果要实现多级(嵌套)的项目列表，可单击“属性”面板上的“缩进”命令
练习二：
?电脑专业
o网络技术
1.网络1班
2.网络2班
o信息技术
1.信息1班
2.信息2班
o电脑维护
?美术专业
?工艺绘画
?广告设计
操作提示：
第一步：输入“电脑专业”等11行，每行按回车，不能用SHIFT+回车
第二步：全部选中，单击“属性”面板中的无序列表按钮
第三步：选中“网络技术……电脑维护”7个段落，选“属性”面板中的缩进按钮
第四步：同样方法让“网络1班”等班级缩进
第五步：选中“网络1班、网络2班”，单击“属性”面板中的有序列表按钮，使其变为有序列表
有时设置好项目符号后，再打进去的字也变成项目符号了，解决这个问题的方法是，在设置项目符号前，先把后面的字输入几字，再去设置项目符号。
选做练习：
?飘雨的季节
?困惑的心情
?羞涩的蓓蕾
?年轻的你我
?蓝色的小屋
i.飘雨的季节
ii.困惑的心情
iii.羞涩的蓓蕾
iv.年轻的你我
v.蓝色的小屋
a.飘雨的季节
b.困惑的心情
c.羞涩的蓓蕾
d.年轻的你我
e.蓝色的小屋
5.飘雨的季节
6.困惑的心情
7.羞涩的蓓蕾
8.年轻的你我
9.蓝色的小屋
三、样式的使用
(一)样式的作用：
避免重复操作，提高操作效率；统一网页的风格
(二)HTML样式
HTML样式与Word中的格式刷功能相似。如果网页中多个地方需要设置“红色、黑体、5字号”等三个属性，如果一个一个去设置效率不高，我们可以先定义一个“HTML样式”为包含“红色、黑体、5字号”等三个属性，以后到需要设置这三个属性的地方应用一下这个HTML样式即可，所以使用“HTML样式”可以提高工作效率。
1、建立HTML样式
第一步：在窗口菜单中打开“HTML样式”面板（属于设计面板组）
第二步：单击面板下方的“新建样式”按钮
（1）输入名称
（2）指定应用范围
（3）指定应用时的效果
（4）设置属性
2、应用HTML样式
选中文字，单击“HTML样式”面板中定义的样式即可
3、清除HTML样式
选中先设置HTML样式的文字，单击面板上的“清除所选样式”或“清除段落样式”
4、修改HTML样式
双击相应的样式名
5、删除HTML样式
选择要删除的样式，单击“HTML样式”面板中的删除按钮
练习三：。
定义一个HTML样式，名称为“red-hei-5”，属性为“红色、黑体、5字号”，任意输入一段文字，把这个HTML样式，多次应用到网页中。
(三)CSS样式（层叠样式表）
?CSS是干什么用的？
你还记得在网页中最大字号是多少吗？对了是7号，再大就不行了，用CSS样式，你可以让一个字占满一个屏幕(如果你喜欢这样做)。用CSS样式还能设置文字的上标、下标、下划线、文字背景等。CSS的功能可强大了!不会CSS，等于没学过网页制作。
?HTML样式与CSS样式的区别？
同样都是样式，但功能有很大的不同，HTML样式的功能只是把原来网页设置的几个属性合并为一个名称，起到方便设置的目的，但并不能增加其它功能，而CSS样式只对原网页设置的扩充，许多原来不能设的属性通过CSS样式可以设了。
1、建立CSS样式
第一步：打开CSS样式面板
第二步：单击面板下方的“新建CSS样式”按钮
（1）指定CSS样式的名称(最好字母开头)，
（2）“类型”选“创建自定义样式”(其它二种以后介绍)，
（3）“定义在”选“仅对该文档”，单击“确定”
（4）设置CSS样式（CSS样式功能非常多，首先要求掌握的是“类型”和“背景”二张卡片的内容。）
2、应用CSS样式
选中文字，然后在面板上单击相应的样式名
3、清除CSS样式
选中先设置CSS样式的文字，单击面板上的“无CSS样式”
4、修改CSS样式
5、删除CSS样式
2.2 在网页中插入图象
一、网页图像的常用格式
1、GIF：支持256色，可以做成逐帧动画，可以设置透明背景，一般用于网页中的小图标，如
2、JPG：支持百万级真彩，一般用于网页中的照片，如
3、PNG：有GIF、JPG的所有优点，是网页图片发展的方向，但图片文件大小稍大。如
DW中也能插入FLASH动画、声音文件、影视文件等，这些内容不属本章内容，但插入这些文件的方法与插入图像相似，有兴趣的同学请自行摸索。
DW只支持以上三种格式的图片，其它如BMP格式是也可以在IE浏览器中被显示，但在DW中无法显示，由于BMP文件体积很大，在网页中一般不推荐。
小知识：
图像有分辨率这个技术指标，由于网页图片一般用于在屏幕上显示，而显示屏的分辨率为每英寸72象素，所以放到网页去的图片分辨率不用很高。如果用数码像机拍照片，选用最低的640X480分辨率即可，千万不用把高分辨率的数码照片直接做到网页中，那些会影响打开网页的速度，而且浪费存储空间。
补充知识：如何保存网页中的图片
在IE浏览器中右击该图片，选“图片另存为”即可。
二、在网页中插入图片
1、插入图片前先把网页保存一下，以免图片丢失
2、图片要放在网页的同一个目录或子目录下
3、把光标定位在需要插入图片的位置，选插入面板上的“图像”按钮
4、网页、图片文件名只能是英文或数字不能用中文
三、图象与文字的位置关系
在WORD排版中，图像的位置可以任意拖动，而在DW中不行。网页中的图片只有独立、左对齐、右对齐三种状态，不能自由摆放图片的位置。
练习一：制作如下网页，完成后以“1.htm”保存。
对齐图像:使用图像属性检查器设置图像相对于同一段落或行中其他元素的对齐方式。可以将图像与同一行中的文本、另一个图像、插件或其他元素对齐。您还可以使用对齐按钮（左对齐、右对齐、居中对齐）设置图像的水平对齐方式。
“默认值”通常指定基线对齐。（根据站点访问者的浏览器的不同，默认值也会有所不同。）
“基线和底部”将文本（或同一段落中的其他元素）的基线与选定对象的底部对齐。
“顶端”将图像的顶端与当前行中最高项（图像或文本）的顶端对齐。
“中间”将图像的中部与当前行的基线对齐。
“文本上方”将图像的顶端与文本行中最高字符的顶端对齐。“绝对中间”将图像的中部与当前行中文本的中部对齐。“绝对底部”将图像的底部与文本行（这包括字母下部，例如在字母 g 中）的底部对齐。“左对齐”将所选图像放置在左边，文本在图像的右侧换行。如果左对齐文本在行上处于对象之前，它通常强制左对齐对象换到一个新行。“右对齐”将图像放置在右边，文本在对象的左侧换行。如果右对齐文本在行上处于对象之前，它通常强制右对齐对象换到一个新行。
小技巧：图像必须插入到文字的最前面，这样图像才能和文字上部对齐，如果图像插入到下部则不能实现这种效果。
考考你：当你把鼠标移到右边的小图上，会显示一行文字“Hi,你好”，看到了
第三章建立网页链接
教学内容：
Dreamweaver 8提供多种创建超链接的方法，可创建到文挡、图像、多媒体文件或可下载软件的链接，可以创建到文档内任意位置的任何文本或图像的链接等。
教学重点：
内部链接的创建方法。
外部链接的创建方法。
锚点链接的创建方法。
E-mail链接的创建方法。
教学难点：
锚点链接的创建方法。
教学方法：讲演法
教学课时：4课时
教学内容与助学过程：
3.1 编织网站链接—足球新闻
3.1.1 案例综述
本例以编织网站中的各种超链接为主要目的，介绍创建超链接种种方法和技巧
3.1.2 案例分析
为实现网页的跳转，将创建：
n 到网站内页面的超链接――内部链接；
n 到网站外页面的超链接――外部链接；
n 电子邮件形式的超链接――E-mail链接；
n 到网页某一特定位置的超链接――锚点链接；
n 以及其他一些链接。
3.1.3 实现步骤
一、准备网页内容
步骤1 选中站点；
步骤2 将素材文件夹中的相关文档复制到站点文件夹下。
二、创建超链接
1、创建内部链接
－－网站内部页面之间创建相互链接关系
步骤1 选中页面中的文字或图像，在属性面板中单击“链接”文本框右侧的文件夹图标，以通过浏览选择一个文件
步骤2 从“目标”下拉菜单中，选择文档的打开位置。
n_blank :新打开的空窗口
n_parent：如果是嵌套的框架，则在父框架中打开。
n_self：会在当前网页所在的窗口或框架中打开。
n_top：会在完整的浏览器窗口中打开。
2、创建外部链接
－－创建链接到绝对地址的外部链接
（1）选中文字或图像之后，直接在属性面板的“链接”文本框中输入外部的链接地址，如https://www.360docs.net/doc/5f1995651.html,
（2）然后在“目标”下拉菜单中设置这个链接的目标窗口。
3、创建E－mail链接
－－当浏览者单击电子邮件链接时，可即时打开浏览器默认的电子邮件程序处理程序。
方法：
（1）选中文本和图像
（2）插入栏｜常用｜电子邮件链接｜输入邮件地址
（3）或在属性面板的链接栏中直接输入
mailto:邮件地址
4、锚点链接
－－是指同一个页面中的不同位置链接。
分为两步：
（1）创建命名锚记，就是在文档中设置位置标记，并给该位置一个名称，以便引用。
（2）创建到命名锚记的链接
5、创建其他类型的链接
（1）创建下载链接
n 当被链接的文件是exe文件或zip文件等浏览器不支持的类型时，这些文件会被下载，这就是网上下载的方法。
n 链接到下载文件的方法，和链接到网页的方法完全一样。
（2）、创建空链接
n 空链接用来激活页面中的对象或文本。当文本或对象被激活后，可以为之添加行为。
方法：选中要制作空链接的对象，在链接文本框中直接输入＃。
n 在一般站点首页的导航栏中的首页链接，就可以是一个空链接
6、创建跳转菜单
跳转菜单是文档中的弹出式菜单，可以创建到可在浏览器中打开的任何文件类型的链接。
方法：
（1）插入栏｜表单｜跳转菜单
（2）在“插入跳转菜单”对话框中，单击＋号添加菜单项
（3）在“选择时。转到URL”文本框中，输入该文件的路径。
7、创建图像地图
图像地图指已被分为多个区域（热点）的图像。当用户单击某个热点时，会发生某种操作。
方法：
（1）选中图像
（2）在图像属性面板中，使用热区工具（矩形、椭圆、多边形），在图像上划分热区。
（3）为绘制的每一个热区设置不同的链接地址和替代文字。
3.2 超链接概述
3.2.1 超链接的类型
n 内部链接这种链接的目标端点是本站中的其他文档。利用这种链接，可以跳转到本站点其他的页面上。
n 外部链接这种链接的目标端点是本站点之外的站点或文档。利用这种链接，可以跳转到其他的网站上。
3.2.1 超链接的类型
n Email链接单击这种链接，可以启动电子邮件程序书写邮件，并发送到指定的地址。
n 锚点链接这种链接的目标端点是文档中的命名锚记，利用这种链接，可以跳转到当前文档中的某一指定位置上，也可以跳转到其他文档中的某一指定位置上。
3.2.2 链接路径
（1）绝对路径：如果在链接中使用完整的URL地址，这种链接路径就称作绝对路径。路径同链接的源端点无关。
（2）相对路径：相对路径可以表述源端点同目标端点之间的相互位置，它同源端点的位置密切相关。（3）基于目录的路径：所有的路径都是从站点的根目录开始的，它同源端点的位置无关。通常用一个斜线“/”表示根目录。
3.2.3 创建超链接
（1）在文档窗口中选中想作为链接的文本或图片
（2）在属性面板链接一项的空白处填入链接的路径，或者单击图标，在弹出的【选择文件】对话框中，选定要链接的文档及采用哪种方式表达路径。
（3）链接的对象可以是多样的，如图片文件，电子表格，或者某个网站。
3.2.4 插入导航条
导航条中按钮图像的状态根据浏览者的鼠标动作而改变。
方法：
1、将光标放到要插入导航条的位置；
2、选择插入|图像对象|导航条命令；
3、或选择插入|常用|图像|导航条命令。
3.3 实战演练―――每周星运
第四章表格处理
教学内容：
本章介绍了表格的基本操作及应用表格进行版式设计的方法和步骤，较详细地介绍了在标准、扩展、布局三种视图下表格的应用，从而使网页布局能够得心应手。
教学重点：
表格的基本操作
应用表格布局（标准视图下）
布局表格
在表格及单元格中输入各种网页元素的方法
表格格式化等操作方法。
教学难点：三种布局模式的应用。
教学方法：讲演法
教学课时：4课时
教学内容与助学过程：
4.1 创建网站相册初识表格
4.1.1 案例综述
使用Dreamweaver 8中提供的【创建网站相册】命令，自动生成足球明星页photo.htm。从中使读者初步认识表格的基本操作方法及其作用。
4.1.2 案例分析
使用【创建网站相册】命令创建的Photo.htm页是采用表格布局，将图片的缩略图排列在网页中的。
n 表格的修改和美化
n 表格的插入
n 添加或删除行列
n 拆分合并单元格等基本操作
4.1.3 实现步骤
一、创建网站像册
方法：
1、将需制作相册的图片放在源图像文件夹中，同时建立一个空目标文件夹，用来存放系统生成的图片和文件。
2、执行“命令|创建网站相册”命令
3、在【创建网站相册】对话框中输入相应的参数，即可。
二、网站相册的修改
方法：
选择“页面属性”，可以进行文字、背景、颜色，以及表格的一些修改。
三、相册表格的美化
选择“命令|格式化表格”命令。
4.2 表格的基本操作
4.2.1 插入表格
【插入】｜【表格】命令，或单击【插入】栏中的【常用】类型中的【插入表格】按钮
4.2.2 选定表格和单元格
表格包括行、列、单元格3个组成部分。
1、选定整个表格
2、选定行或列
3、选定单元格
4.2.3 调整表格的大小
1、选定表格→鼠标拖动。
2、调整行和列的宽度
鼠标放在一列的上面，出现向下的箭头时，单击，就可以选中一列。在属性面板中可以设置所选列的宽和高。
4.2.4 设置表格和单元格的属性
1. 设置表格属性
2. 设置单元格属性
4.2.5 添加/删除行列
1. 通过表格【属性】面板增加与删除表格的行和列
2. 通过【修改】菜单完成增加与删除表格的行和列
4.2.6 单元格的合并和拆分
1、合并单元格
按Ctrl，点单元格，选中表格，在属性面板中点“合并所选单元格，使用跨度”。
2、拆分单元格
在单元格中单击，选中单元格。点击属性面板中的“拆分单元格为行或列”，设置拆分方式。
4.2.7 单元格的复制、粘贴、移动和清除
在设计网页时，可以一次复制、粘贴、移动和清除一个或多个单元格。操作方法如下：
1.在网页编辑窗口中选中要复制的对象
2.复制－－按Ctrl+C，或【编辑】｜【复制】命令。
3.移动－－按Ctrl+X，或【编辑】｜【剪切】]命令。
4.粘贴－－按Ctrl+V，或【编辑】｜【粘贴】命令。
5.拖动－－按住Ctrl＋拖，则完成复制操作。直接拖曳可完成对象的操作。
6.清除－－按Delete，或【编辑】｜【清除】命令。
4.2.8 表格的嵌套
嵌套表是在表格中的一个表格。在一个单元格中，插入一个表格，就是嵌套表。
将光标插入当前表格的某个单元格中，然后可选择【插入】｜【表格】命令，或单击【插入】栏的【常用】类型中的【插入表格】按钮
4.3 网页的页面布局
4.3.1 网页布局类型
n “国”字型
n 拐角型
n 标题正文型
n 左右框架型
n 上下框架型
n 综合框架型
n 封面型
n Flash型
n 变化型
4.3.2 关于第一屏
一般来讲，在800×600的屏幕显示模式(这也是最常用的)下，在IE安装后默认的状态(即工具栏地址栏等没有改变)下，IE窗口内能看到的部分为778px×435px.
4.3.3 有关导航栏的位置
一般来讲，导航栏要在“第一屏”能显示出来，但是有时第一屏可能会小于上面所说的435px，基于这点考虑，那种横向放置的导航栏要优于纵向的导航栏考虑
4.3.4 什么样的布局是最好的
n 如果内容非常多，就要考虑用“国字型”或拐角型；
n 如果内容不算太多而一些说明性的东西比较多，则可以考虑标题正文型；
n 那几种框架结构的一个共同特点就是浏览方便，速度快，但结构变化不灵活；
n 而如果是一个企业网站想展示一下企业形象或个人主页想展示个人风采，封面性是首选；
n Flash型更灵活一些，好的Flash大大丰富了网页，但是它不能表达过多的文字信息。
4.4 使用表格的其他视图
Dreamweaver 8提供了标准视图、扩展视图、布局视图3种视图模式。通常使用的是标准视图，可通过插入栏的“布局”类别，切换到布局视图或扩展视图。
4.4.1 扩展视图
扩展视图的主要作用是临时向文档中的所有表格添加单元格的边距和间距，并且增加表格的边框，这样可以使编辑操作更加容易。
4.4.2 布局视图
在“布局视图”方式下利用表格进行网页排版设计更为直观方便。通过鼠标自由拖拽就可绘制任意的表格布局，且可自由移动。
4.4.3 创建布局表格和布局单元格
1、绘制布局表格
2、绘制布局单元格
3、移动布局表格和布局单元格
4.4.4 设置布局表格和单元格属性
1、设置布局表格属性
2、设置布局单元格的属性
4.5 应用表格布局页面―――布局案例
4.5.1 案例综述
本例使用表格进行页面布局，从中使读者掌握以下知识要点1．表格在用于页面布局时的属性设置。
2．表格的嵌套。
3．表格细线的制作。
第五章层的应用
教学内容：
本章介绍了关于层的创建、设置及相关使用技巧，并通过具体的实例让读者真正掌握层的运用。了解层在布局中的优势和劣势，理解利用层的属性可制作多种动态效果。
教学重点：
层的创建、选择、编辑、保存等操作方法
层的属性设置
在层中输入各种网页元素的方法
层及嵌套层、层的叠放次序、层的可见性等内容。
教学难点：
嵌套层的创建方法
层的相关属性的设置
教学方法：讲演法
教学课时：4课时
教学内容与助学过程：
5.1 制作层布局页面―――“环游世界”
5.1.1 实例综述
通过本例的学习，读者可充分体会使用层布局页面的随意性。
5.1.2 实例分析
不论文字还是图片都是采用层来进行定位的，因此在例中我们逐步介绍
n 如何在页面插入层
n 如何通过控制层的Z轴参数来设置层之间的重叠关系
n 如何精确定位层等操作方法。
5.1.3 实现步骤
插入层→在层中添加内容→精确定位层，控制大小→设置层之间的叠放次序。
5.2 层的基本操作
5.2.1 创建层
方法：
1、插入法
插入｜布局对象｜层
2、拖放法
拖层图标到编辑区
3、绘制法
单击层图标后，到编辑区拖动鼠标绘制。
5.2.2 激活和选中层
方法：
1.单击层的激活标志，或层内任何地方
2.将光标置于该层内，然后单击
3.单击层边界。
4.在层面板中单击层。（＋shift可选择多个层）。
5.2.3 删除层
方法：
n 当选中一个层后，按Delete键或单击【剪切】按钮，可删除该层。
n 也可在层面板中删除该层
5.2.4 调整、移动和对齐层
1、调整层的大小
方法：
1) 选中需要调整的层，此时在层的边框四周出现8个黑色活动块，用鼠标拖曳某个活动块，即可调整层的大小。
2) 选中需要调整的层，在层的【属性】面板的【宽】和【高】，两个文本框中，输入层的宽度和高度和高度尺寸，可精确调整该层的尺寸。
2、移动层
前提：
n “防止重叠”未被勾选。
方法：
n 选定层，出现层激活标志，用鼠标左键拖该标志。
n 选定层，用键盘方向键移动层。
3、对齐层
n 选定多个层，对齐的标准是最后一个选择的层，该层控制点的实心点，而其他为空心点。n 修改｜对齐｜对齐下缘。
5.3 层的属性设置
5.3.1 设置层的属性
1.层编号：层的名称。
2.左和上：距页面或父层的左上角相对位置
3.宽和高：层的宽度和高度。
4.Z轴：层的重叠顺序。
5.可见性：层的初始显示状况（可见或隐藏）
6.背景图像、背景颜色：
7.溢出：确定当层中内容超出设定大小时要采取的行动。
8.剪辑：定义层的可见区域，并用于将该范围外的内容裁剪掉。
5.3.2 层面板的使用
选择【窗口】｜【其他】｜【层】命令，或按F2键，可打开【层】面板。
1.选定某个层
2.更改层名
3.显示、隐藏层
4.改变层的叠放次序
5.创建和取消嵌套层
6.禁止层重叠
5.4 层与表格互换
5.4.1 将层转换为表格
操作步骤如下:
（1）选中要转换为层的表格。
（2）选择“修改”|“转换表格到层”命令，系统将打开“转换表格为层”对话框（3）选中合适的布局工具复选框后，单击【确定】按钮，表格就可按要求转换为层。5.4.2 表格转换为层
n 问题：不是所有的浏览器都支持层。
n 解决方法：使用层创建网页布局，然后将层转换为表格。
（1）打开要将层转换为表格的页面。
（2）选择【修改】｜【转换】｜【层到表格】命令，系统将打开【转换层为表格】对话框. （3）选择好对话框中的选项后，单击【确定】按钮，层布局的页面就可转换成表格布局的页面
5.5 实战演练―――冷酷青春
第六章框架
教学内容：
本章主要讲了框架的使用，包括创建框架、命名框架、设置框架以及保存框架等操作。在使用框架的过程中一定要明白框架的基本结构。框架在网页的设计中可用来制作电子图书。使用框架的一个难点框架集和框架之间的关系，通常在一个框架中所有的框架都是通过一个框架集文档来调用各个框架的。另一个难点就是框架属性的设置。这些都需要在实际的操作过程中不断地去思考和摸索才能够熟练掌握。
教学重点：
创建框架网页
框架网页的选择
设置框架和框架集的属性
编辑框架
创建框架间页面的超链接
教学难点：
设置框架和框架集的属性
创建框架间页面的超链接
教学方法：讲演法
教学课时：4课时
教学内容与助学过程：
6.1 应用框架制作电子书
6.1.1 案例综述
本例将制作一个HTML在线教程的页面，页面分三个区域，在顶部放置标题栏，左侧框架放置导航栏（即目录），单击链接，在右侧框架中打开链接内容
一个框架横放在顶部：Web站点的徽标和标题
一个较窄的框架位于左侧：导航条
一个大框架占据页面的其余部分：主要内容
框架：是指浏览器窗口中的一个区域。
框架集：定义了一组框架的布局和属性，包括框架的数目、框架的大小和位置以及在每个框架中初始显示页面的URL。
6.1.2 案例分析
n 理解框架集、框架的概念。
n 创建框架集
n 制作框架、链接页面
n 创建超链接
n 保存框架集
6.1.3 实现步骤
1. 创建框架集。
2. 制作框架页
3. 创建导航栏超链接
4. 保存框架集
6.2 框架的基本操作
插入预定义的框架集
自行创建
创建框架集的方法：
6.2.1 创建框架和框架集
1.选择预定义的框架集
创建包含当前文档的框架集
1) 打开一个文档
2) 插入栏|布局|框架
3) 框架集图标的蓝色区域表示当前文档
创建新的空预定义框架集
4) 文件|新建
5) “新建文档”对话框|框架集
6) 选择一个所需框架集
2.设计自己的框架集
创建框架集
1) 新建一个空白HTML文档
2) 修改|框架集|拆分左(右、上、下要)框架
3) 在光标停留在某个框架中，可继续拆分
注：利用“查看|可视化助理|框架边框”使边框可见
删除框架集
网页设计与制作实例教程
网页设计与制作实例教程 习题答案 第1章网页与网站基础 一、选择题 1．A 2．B 3．C 4．C 5．A 二、判断题 1．√2．×3．√4．×5．√ 三、问答题 略 第2章网页规划设计 一、选择题 1．D 2．A 3．C 4．A 5．C 二、判断题 1．×2．×3．×4．√5．√ 三、问答题 1．答：网站需求分析一般包括三个阶段的内容：网站背景分析、总体需求分析、具体需求分析。（每个阶段可再详细描述。） 2．答：可从以下几个方面来阐述网站设计的原则：①日期、时间和数字；②欢迎词； ③弹出窗口和引导页面；④新闻和公告信息；⑤网址；⑥控件；⑦链接；⑧主页内容 3．答：打开新浪网首页，分析其布局类型。（答案略） 4．答：网页色彩搭配方法可从以下两个方面去阐述：①根据页面风格以及产品本身的诉求确定主色；②根据主色确定配色。 网页色彩搭配技巧可从以下几个方面去阐述：①用一种色彩；②用两种色彩；③用一个色系；④用黑色和一种色彩以及色彩搭配忌讳的方面。 5．答：打开当当网，具体分析其规划过程。（答案略） 第3章初识网页制作软件 一、选择题 1．C 2．C 3．B
二、填空题 1．代码、拆分、设计2．文件、资源、规则3．超级链接 三、操作题 略 第4章制作网页内容 一、选择题 1．D 2．B 3．A 4．D 5．ABD 6．D 7．B 8．D 9．A 10．A 二、判断题 1．√2．√3．×4．√5．√6．√7．√8．√9．×10．√三、操作题 略 第5章设置网页超级链接 一、选择题 1．D 2．D 3．A 4．D 5． C 二、判断题 1．×2．×3．×4．√5．× 第6章使用CSS样式美化网页 一、选择题 1．B 2．C 3．C 4．B 5．A 6．D 7．D 8．D 9．B 10．C 11．A 12．A 13．C 14．D 15．D 16．A 17．A 18．B 19．D 20．D 二、简答题 1．×2．×3．×4．×5．×6．×7．√8．×9．√10．√11．×12．×13．×14．√15．√16．√ 第7章规划布局网页 一、选择题 1．B 2．A 3．B 4．B 5．D 二、简答题
网页制作基础教程
网页制作基础教程 一、什么是HTML HTML（超文本标记语言）是网页中使用的语言，他能被网页浏览器（IE或Netscape）解释，从而显示出丰富多彩的信息（图片、文字、声音、影象、动画等）。 制作网页前首先要弄懂什么是HTML。 在IE中点击"查看"→"源文档"，就能看到该网页的HTML代码。下面是个网页文档（model.htm）的HTML代码：
第一段文字。
第二段文字。
【操作】请在记事本中输入以上代码，命名为test1.htm，存于D盘，然后双击打开看看。 标记一般是成对出现的，#FFFFFF表示使用的颜色是白色。 .........
之间是h1号标题字...
之间是h2号标题字 ...之间的文字为红色 HTML是一套国际标准，其标记有几百种，您并无需全部了解他们，只要记住其中常用的十几种，就能够做出很漂亮的网页来。 常用的标记举例：《Dreamwearver网页制作实用教程》教学大纲设计
Dreamwearver CS3网页制作实用教程教学大纲 一、课程的任务 网页制作课程是一门应用性和理论性都很强的课程，是软件技术专业的一门专业课程。随着网络广泛应用，网页制作技术在广大大中专院校得到了普及和推广。网页制作者主要讲叙的是静态网页的制作，它是该专业后继课程动态网页制作的基础课程。 本课程针对网页设计与制作人员的要求，结合高职高专人才培养的特点，精心安排和组织了以实践岗位为中心的容，通过对本课程的学习，学生能够掌握有关网页制作的技术及其综合应用：如规划、页面组织、素材准备等，通过实践训练，能够举一反三，能够将所学知识点与工作技巧融合，为本专业学生将来成为“职场精英”打下坚实的基础，本课程侧重于实际的软件开发，加强实践环节，提高网页制作能力，使学生适应当前的计算机网络流行趋势。 二、课程的基本要求 掌握建立与网页设计方法。使用网页设计常用软件Dreamweaver创建与设置、管理与维护、测试与发布的技术与方法。网页与的基本概念、策划与创建原则、的开发与发布工作流程、网页制作的各种方法和技巧，如文本处理、图象处理、超级、网页布局、CSS样式、层的应用、动态特效、多媒体网页制作、交互式网页制作等。 在较短的时间，通过学习《Dreamwearver CS3网页制作实用教程》，能够设计制作出布局美观、合理、包含文字、图形、图象、动画、声音、视频等多种媒体信息并具有交互功能的网页；能够建立、管理与发布小型；应用与网页技术传授知识、传播信息。 三、课时分配表
四、课程的要求与容 基础 教学要求 1、使学生了解和掌握、网页的基本知识； 2、使学生了解和掌握网页的基本结构； 3、使学生了解网页开发及建设的工具。 本章的重点和难点 重点： 1、创建和管理； 2、创建和编辑首页； 3、开发流程介绍。 难点： 1、创建和管理； 2、创建和编辑首页。 教学容： §1.1任务导入与问题思考 1、任务导入——访问“搜狐” 2、问题与思考
简单的网页制作教程-设计一个个人网站
题目：设计一个个人网站 一、要求： 1．使用Dreamweave网页工具制作一个个人网站； 2．包含至少四个网页: 包括首页、个人简介、个人相册等（可随意设计），网页之间用超链接相连。 3．网页中要有图片和文字内容，用表格进行页面布局； 4．添加至少两种行为，并为首页添加背景音乐。 5. 在网站中设计一个表单页面。 6. 首页必须包含页面标题，动态按钮导航栏。 首先新建一个文件夹，文件夹的名字不能为汉字，做网站所有的路径都必须用字母或者数字， 不能用汉字，我们就用名字吧，譬如说名字张三，那文件夹名字就是zs，如图 打开Dreamweaver软件，得到图 做网页要新建站点，关于站点配置服务器什么的，这里不讲了，只讲建立站点。 选择站点——新建站点。 我们建的文件夹就是站点根文件夹。
新建站点后得到这样一个界面 点选高级，得到界面 站点名称与我们建文件夹得名字相同，zs填进去就可以了本地根文件夹就是我们新建的那个文件夹zs， http地址为http://localhost/zs
接下来选择左侧栏里远程信息 点击无后面的那个三角，选择本地网络，远端文件夹同样选择我们新建的那个文件夹 接下来点选左面菜单里的测试服务器， 点选访问后面那个三角，选择本地网络，测试服务器文件夹也为我们建好的文件夹zs，在url前缀后面加上zs
然后点击确定就可以了得到这样一个界面。 下面看老师的第一条要求，是要至少四个网页，那我们就做四个 单击新建，然后单击 接下来，选择 然后单击创建，接下单击文件——保存，保存这个文件，保存在我们一开始建好的文件夹里面，保存名字不能是汉字，只能是字母或者数字，因为我们只坐四个网页，可以简单一点，把这四个网页命名为a、b、c、d，或者1、2、3、4，当然一个网站默认的索引首页名为index，这里也用index，
怎样制作自己的网页
和怎样制作自己的网页 时间:2009-09-22 19:35来源:未知作者:大宝库点击:9865次 阅读工具：字体：大中小 一 首先，可以告诉想学网页制作的朋友。学习制作网页和学习其它知识一样，是要有基础的。在基础之上学习起来会比较轻松和快捷的。其次，要清楚学习它是用来做什么。 建议你要具备的条件：对电脑熟练操作，使用电脑最好在一年以上，对网页设计感兴趣，有较充足的学习时间，熟悉office办公软件。当然，这些不是一定必须的。 第一阶段：开始时最好是学些网页编辑软件，如：FrontPage、Dreamweaver.这样可以使您更了解网页制作与运营的原理。最好使拿本教程来学学，结合教程边学习边制作。 第二阶段：会用网页制作软件后，已会制作一个较完整的网站了。但为了能使自己设计制作的网页尽善尽美，还是学习网页的核心技术吧！网页编辑语言（包括:html、css、javascript、asp、xml等）。你可以选择地学习。 第三阶段:结合你自己已掌握地知识来开发网站，可以开发出别人给你定义的目标网站。到了这个时候，你就成为真正的网站开发者了。 怎样制作网页，不是说一两篇文章能够说清楚的。以上介绍的是制作网页的主要纲要，希望能够给想要学习制作网页的朋友一个参考。 二 一、工具 1、空间 网页做好了肯定是要发表上网的，所以必须先申请一个空间；免费的空间不是很稳定，容量又小，也不好申请，建议到大的网站如新浪、网易去先买一个个人空间，大概有个20M以上的就可以了。 2、软件 推荐使用Dreamweaver6.0中文版，这个软件最大的特点就是“所见即所得”，也即是制作过程中看到的，便是到时发布到网络上的。 二、教程
中文版DreamweaverCS6网页制作实用教程第六章使用层与Spry布局网页
使用层与 Spry 布局网页
层(AP Div)用于网页元素的精确定位，层的使用非常广泛，可以定位页面上的任意位置， 在层中可以插入各种元素。Spry 相当于一个 JavaScript 框架库，使用它可以灵活创建各种丰富 的网页框架效果。
层的基本作用 层的基本操作 转换表格和层
6 .1
创建层
层(Ap Div)就像是包含文字或图像等元素的胶片，按顺序叠放在一起，组合成页面的最终 效果。层可以精确地定位页面上的元素，并且在层中可以加入文本、图像、表格、插件等元素， 还可以插入嵌套层。在 Dreamweaver 中运用层，为设计者提供了强大的网页控制能力。层不但 可以作为一种网页定位技术，也可以作为一种特效形式出现。熟练掌握层的使用方法，是网页 制作中最重要的环节之一。
6 .1.1 创建普通层
在网页文档中插入层后， 在 【代码】 视图中会自动插入 HTML 标签。 层的常用标签有
中文版 Dreamweaver CS6 网页制作实用教程
(1) 插入光标 图 6-1 插入普通层
(2) 插入层
6 .1.2 创建嵌套层
层与表格一样， 可以在层中插入嵌套层， 方法类似创建嵌套框架。 将光标移至创建的层中， 选择“插入”|“布局对象”| AP Div 命令，在该层中插入嵌套层，如图 6-2 所示。
(1) 插入光标 图 6-2 插入嵌套层
(2) 插入层
除了使用上面所介绍的菜单命令插入层外，还可以在网页中绘制层。 【例 6-1】在 Dreamweaver CS6 中绘制层。 (1) 选择【窗口】|【插入】命令，打开【插入】面板，然后单击该面板中的【常用】按钮， 并在弹出的下拉列表中选中【布局】选项，打开【布局】插入面板。 (2) 在【布局】插入面板中单击【绘制 AP Div】命令，然后将鼠标光标移至网页文档，单 击并按住鼠标左键拖动即可绘制层。
6 .2
层的基本操作
在 Dreamweaver 中选择【窗口】|【AP 元素】命令，打开【AP 元素】面板。在该面板中显 示了网页文档中所有插入的层，如图 6-3 所示，用户可以通过它管理网页文档中所有插入的层 元素。
-112-
Dreamweaver CS6网页设计实用教程期末考试试卷A及答案
Dreamweaver CS6网页设计实用教程期末考试试卷（A卷） （考试时间90分钟，满分100分） 一、选择题（1～28题，每题1分，共28分） 下面各题A、B、C、D四个选项中，只有一个选项是正确的，请将正确选项涂抹在答题卡相应的位置上，答在试卷上不得分。 1．在网页中不能添加的元素是（） A．文字、图像B．表格、动画 C．声音视频D．纸张等实物 2．下面不属于“页面属性”中可以设置的内容（） A．外观B．链接 C．跟踪图像D．首选参数 3．下列（）方法无法添加网页标题 A．在HTML代码中添加网页标题B．在文档窗口中添加网页标题 C．在网页属性中添加网页标题D．在文档工具栏中添加网页标题 4．下面哪个功能不是开始页能够完成的操作（）。 A．创建新网页B．创建新网站 C．打开网页文档D．删除网页文档 5．在下面的选项中哪种不属于网页设计的范围? （） A．页面内容设计B．网页架构设计 C．服务器设计D．LOGO设计 6．下面的哪一项不属于网页标准色的三大色系?（） A．蓝色B．黄/橙色 C．黑/灰/白D．绿 7．下面文件属于静态网页的是( )。 A．index.asp B．index.jsp C．index.html D．index.php 8．下面选项中哪个不是单元格的水平对齐方式之一（）。 A．两端对齐B．默认 C．居中对齐D．右对齐 9．以下说法正确的是（） A．如果要选择多个非连续的单元格，只要按下[Ctrl]键，依次单击要选择的单元格即可B．表格一旦创建，单元格就不能被合并和拆分了 C．表格的列的宽度和行的高度不能重新设置 D．以上都正确 10．表格的行标记是（） A．tr B．td C．table D．tl 11．表格的单元格标记是（） A．tr B．td C．table D．th 12．不可以在插入表格时弹出对话框中设置的属性（）
个人网页制作简明教程
个人网页制作简明教程 （孙晓鹏 整理） 资料来源：https://www.360docs.net/doc/5f1995651.html,/ 目 录 1. 认识网页 2. 制作主页前的准备 3. 如何选择网页制作工具 4. 如何把握网页布局 5. 安装Dreamweaver8 6. 规划站点 7. 制作模板 8. 制作首页 9. 套用模板和修改模板 10.网页的发布 1. 认识网页 1.1. 什么是网页 网页的学名称作HTML文件，是一种可以在www网上传输，并被浏览器认识和翻译成页面显示出来的文件。 WWW是“World Wide Web"的缩写；HTML的意思则是“Hypertext Markup Language”,中文翻译为“超文本标记语言”。“超文本”就是指页面内可以包含图片、链接、甚至音乐，程序等非文字的元素。 网页就是由HTML语言编写出来的。HTML语言是一种排版语言，语法就类似于这样：“页高8宽5，(1,2)处插入高1宽1的图片A...” 如果您是使用WPS或则Word的高手，那么恭喜您，网页制作的学习您已经走了一半路了！ 1.2. HTML 全称HyperText Markup Language，正式名称是超文本标记语言，HTML语言发展很快，已历经HTML1.0、HTML2.0和HTML3.0、HTML4.0多个版本，现在HTML5.0正在测试，同时DHTML (动态)、VHTML(虚拟)、SHTML等也飞速发展起来。我们现在一般只要掌握HTML4.0就可以了。 html利用标记（tag）用来描述网页的字体、大小、颜色及页面布局的语言，使用任何的文本编辑器都可以对它进行编辑，与VB、C++等编程语言有着本质上的区别。
网页制作教程,网页制作入门教程
选修课《网页设计》实践考核题 题目：设计一个个人网站 一、要求： 1．使用Dreamweave网页工具制作一个个人网站； 2．包含至少四个网页: 包括首页、个人简介、个人相册等（可随意设计），网页之间用超链接相连。 3．网页中要有图片和文字内容，用表格或框架进行页面布局； 4．添加至少两种行为，并为首页添加背景音乐。 5. 在网站中设计一个表单页面。 6. 首页必须包含页面标题，动态按钮导航栏。 下面我们大家统一一下软件版本，我用的是网页三剑客cs3版本的，大家可以去迅雷下载，因为我们要用到flash 建议大家也按装好flash 首先新建一个文件夹，文件夹的名字不能为汉字，做网站所有的路径都必须用字母或者数字， 不能用汉字，我们就用名字吧，譬如说名字张三，那文件夹名字就是zs，如图
打开Dreamweaver软件，得到图 做网页要新建站点，关于站点配置服务器什么的，这里不讲了，只讲建立站点。选择站点——新建站点。 我们建的文件夹就是站点根文件夹。 新建站点后得到这样一个界面 点选高级，得到界面
站点名称与我们建文件夹得名字相同，zs填进去就可以了 本地根文件夹就是我们新建的那个文件夹， http地址为http://localhost/zs 接下来选择左侧栏里远程信息 点击无后面的那个三角，选择本地网络，远端文件夹同样选择我们新建的那个文件夹
接下来点选左面菜单里的测试服务器， 点选访问后面那个三角，选择本地网络，测试服务器文件夹也为我们建好的文件夹zs，在url前缀后面加上zs 然后点击确定就可以了得到这样一个界面。 下面看老师的第一条要求，是要至少四个网页，那我们就做四个 单击新建，然后单击 接下来，选择
Dreamweaver CS3网页制作基础教程第2章习题答案
第2章规划、创建和管理站点 一、填空题 1、【站点定义】对话框包括【基本】和【（）】两种状态。 正确答案：高级 2、通过【站点】／【（）】命令可打开【管理站点】对话框对站点进行编辑。 正确答案：管理站点 3、在Dreamweaver中，可以通过设置【（）】来定义Dreamweaver的使用规则。 正确答案：首选参数 4、新建文档默认的扩展名可以通过【首选参数】对话框的【（）】分类来设置。 正确答案：新建文档 二、选择题 1、下列关于网站规划的说法错误的是（）。 A、网站必须有一个明确的主题 B、网站栏目设置要合理 C、网站推广一定发生在网站发布之后 D、网站必须有自己的风格 正确答案：C 2、新建网页文档的快捷键是（）。 A B C D 正确答案：B 3、是否允许使用 的（ A、常规 B、不可见元素 C、复制/粘贴 D、新建文档 正确答案：A 4、关于【首选参数】对话框的说法，错误的是（）。 A、可以设置是否显示欢迎屏幕 B、可以设置是否允许输入多个连续的空格 C、可以设置是否使用CSS而不是HTML标签 D、可以设置默认文档名 正确答案：D 三、问答题 1、常见的网页布局类型有哪些？ 常见的网页布局类型有“国”字型、“匡”字型、“三”字型、“川”字型、标题文本型、框架型、封面型和Flash型等。 2、举例说明通过【首选参数】对话框可以设置Dreamweaver的哪些使用规则。 答：在Dreamweaver中可以通过设置【首选参数】来定义Dreamweaver的使用规则。例如，在Dreamweaver CS3启动时是否显示欢迎屏幕，在文本处理中是否允许输入多个连续的空格，在定义文本或其他元素外观时是使用CSS标签还是使用HTML标签，不可见元素是否显示，新建文档默认的扩展名是什么等。 四、操作题
网页制作基础教程内容
样章 第1章网页设计基础 Dreamweaver 8.0是Macromedia 公司推出的目前最新版本的网页设计软件，站点管理和页面设计是它的两大核心功能，它采用多种先进的技术，易学、易用。只要掌握初步的知识，再加上自己的创意，即可制作出独树一帜的网页。 本章重点介绍在Dreamweaver 8.0中如何创建站点并进行站点管理，从而为下一步开发网站做好准备，同时，通过本章的学习使读者熟悉Dreamweaver 8.0界面及运行环境。 1.1 初识Dreamweaver 8.0 在使用Dreamweaver开发网站之前，首先需要熟悉一下Dreamweaver的启动及设计环境。俗话说“工欲善其事，必先利其器”，通过本节可以使大家了解Dreamweaver 8.0这个神奇网页制作软件的“庐山真面目”，会使后面的学习变得更加轻松，上手更加迅速。 1.1.1 Dreamweaver 8.0的启动 步骤 ①单击任务栏“开始”按钮，选择“程序”命令。 ②将光标向右移动，选择Macromedia文件夹。 ③将光标再向右移动，单击Macromedia Dreamweaver 8.0图标，Dreamweaver 8.0就被启动了。Dreamweaver 8.0根据设计人员和编码人员的需求自带了2种配置，此外也还可以构建自定义工作区。首次启动Dreamweaver 8.0时，系统会弹出一个“工作区设置”界面，可以从中选择一种工作区布局，如图1-1所示。“设计器”工作区适合于一般的用户，“编码器”工作区指的是代码编辑界面，适合于具有较高水平网页编程技术的用户。在这里可以选择“设计器”工作区。 如果在操作过程中想改变工作区，可单击“窗口”｜“工作区布局”命令，从中选择相应的工作区，如图1-2所示。 1.1.2 Dreamweaver 8.0的工作环境 启动Dreamweaver 8.0，双击打开任意一个网页文件，此时Dreamweaver 8.0工作界面如图
HTML网页制作教程
1、HTML基本概念 什么是HTML文件？ ?HTML的英文全称是Hyper Text MarkUp Language，中文叫做“超文本标记语言”。 ?和一般文本的不同的是，一个HTML文件不仅包含文本内容，还包含一些Tag，中文称“标记”。 ?一个HTML文件的后缀名是.htm或者是.html。 ?用文本编辑器就可以编写HTML文件。 这就试写一个HTML文件吧！ 打开你的Notepad，新建一个文件，然后拷贝以下代码到这个新文件，然后将这个文件存成first.html。
Dreamweaver网页制作教程
Dreamweaver网页制作教程：定义站点 网页教学网【转载】 Web 站点是一组具有如相关主题、类似的设计、链接文档和资源。Dreamweaver MX 2004 是一个站点创建和管理工具，因此使用它不仅可以创建单独的文档，还可以创建完整的 Web 站点。创建 Web 站点的第一步是规划。为了达到最佳效果，在创建任何 Web 站点页面之前，应对站点的结构进行设计和规划。决定要创建多少页，每页上显示什么内容，页面布局的外观以及页是如何互相连接起来的。 请执行以下操作： 启动 Dreamweaver MX 2004： 选择“站点”>“管理站点”（即，从“站点”菜单选择“管理站点”）。出现“管理站点”对话框。 在“管理站点”对话框中，单击“新建”，然后从弹出式菜单中选择“站点”。出现“站点定义”对话框。 如果对话框显示的是“高级”选项卡，则单击“基本”。出现“站点定义向导”的第一个界面，要求您为站点输入一个名称。 在文本框中，输入一个名称以在 Dreamweaver MX 2004中标识该站点。该名称可以是任何所需的名称。
单击“下一步”。出现向导的下一个界面，询问您是否要使用服务器技术。 选择“否”选项，指示目前该站点是一个静态站点，没有动态页。 单击“下一步”。出现向导的下一个界面，询问您要如何使用您的文件。 选择标有“编辑我的计算机上的本地副本，完成后再上传到服务
器（推荐）”的选项。在站点开发过程中有多种处理文件的方式，初学网页制作的朋友请选择此选项。 单击该文本框旁边的文件夹图标。随即会出现“选择站点的本地根文件夹”对话框。 单击“下一步”，出现向导的下一个界面，询问您如何连接到远程服务器。从弹出式菜单中选择“无”。您可以稍后设置有关远程站点的信息。目前，本地站点信息对于开始创建网页已经足够了。单击“下一步”，该向导的下一个屏幕将出现，其中显示您的设置概要。 单击“完成”完成设置。随即出现“管理站点”对话框，显示您的新站点。单击“完成”关闭“管理站点”对话框。 现在，已经为您的站点定义了一个本地根文件夹。下一步，可以
网页制作基础教程
第一章网页制作基础 1、什么是网页 一般浏览器中打开的都是网页，这些文档是通过超文本标记语言HTML表示出来的； 主页：在网站中默认打开的页面称为主页，也叫首页，主页是进入网站的门户， 网页中包括的内容： 文本，图像，超级链接，表格，表单，多媒体及一些特殊的效果 2、网站及运作原理 网站是在互联网上一个固定的面向全世界发布消息的地方，它由网站地址和网站空间构成； 网站开发者常常将网站称作为站点，在网站的开发者来说，网站就是在计算机上创建的一个多级的文件夹，并在各文件夹中保存着相关网页文件。 根据站点文件夹所在的位置分为：本地站点和远程站点； 根据服务技术分：静态网站和动态网站 3、了解HTML语言 HTML是网上用于编写网页的主要语言，使用HTML语言编写的网页文件也是一个标准的纯文本文件，可以使用文本编辑器将它打开，但是该纯文本文件如果使用浏览器打开就会看到排版整齐的网页； 4、HTML语言标签 HTML标签用来标记网页元素，以形成文本布局，文字的格式及五彩缤纷的画面，HTML 的标签分单标签和成对标签两种 基础标签：
5、常用动态建站技术 ASP是由微软开发的动态网页技术标准，其原理通过在HTML页面中加入VB JA V A代码，服务器在返回网页之前首先执行这些代码，产生最终的结果。 6、网站的制作流程及制作工具 初期规划：建站之前，要有明确目的，要明白建立网站的目的，接受对象是哪些群体，要为访问者提供怎样的服务，然后对整个网站进行策划， 中期制作：搭建本地站点，建立文件夹，建立站点结构图，设置页面属性等； 后期工作：全面测试，上传后进行实地测试，完成本地测试后，再上传到服务器，以便进行远程测试； 7、网页设计工具 Dreamweaver 8 是最常用的网页编辑工具之一，使用该工具可以在其提供的三种视图中进行项目1 网页制作基础知识答案【网页设计与制作项目教程】
一、填空题（2‘*5） 1、 题干由网页构成，并且根据功能的不同，网页又有____和动态网页之分。知识点编号 题目类型填空题 难度等级简单 权重分值2分 答案静态网页 答案说明 由网页构成，网页有静态和动态之分。所谓静态网页是指用户无论何时何地访问，网页都会显示固定的信息，除非网页源代码被重新修改上传。静态网页更新不方便，但是访问速度快。而动态网页显示的容则会随着用户操作和时间的不同而变化，这是因为动态网页可以和服务器数据库进行实时的数据交换。 关键字认识网页 题干Web标准是一系列标准的集合，主要包括结构、_____和____。知识点编号 题目类型填空题 难度等级简单 权重分值2分 答案表现和行为 答案说明 Web标准并不是某一个标准，而是一系列标准的集合，主要包括结构（Structure）、表现（Presentation）和行为（Behavior）三个方面。 关键字Web标准3、 题干HTML中文译为________________，主要是通过HTML标记对网页中的文本、图片、声音等容进行描述。 知识点编号 题目类型填空题 难度等级简单 权重分值2分 答案超文本标记语言 答案说明 HTML（英文Hyper Text Markup Language的缩写）中文译为“超文本标记语言”，主要是通过HTML标记对网页中的文本、图片、声音等容进行描述。 关键字HTML语言简介 4、 题干HTML语言主要是通过_______________对网页中的文本、图片、声音等容进行描述。
知识点编号 题目类型填空题 难度等级简单 权重分值2分 答案HTML标记 答案说明HTML中文译为“超文本标记语言”，主要是通过HTML标记对网页中的文本、图片、声音等容进行描述。 关键字HTML语言简介 5、 题干在建设中，HTML用于搭建页面结构，CSS用于设置页面样式，__________用于为页面添加动态效果。 知识点编号 题目类型填空题 难度等级简单 权重分值2分 答案JavaScript 答案说明考察对JavaScript的理解 关键字JavaScript语言简介 二、判断题（2‘*10） 1、 题干因为静态网页的访问速度快，所以现在互联网上的大部分都是由静态网页组成的。知识点编号 题目类型判断题 难度等级简单 权重分值2分 答案错 答案说明 现在互联网上的大部分都是由静态网页和动态网页混合组成的，两者各有千秋，用户在开发时可根据需求酌情采用。 关键字认识网页 2、 题干网页主要由文字、图像和超等元素构成，但是也可以包含音频、视频以及Flash等。知识点编号 题目类型判断题 难度等级简单 权重分值2分 答案对 答案说明网页主要由文字、图像和超等元素构成。当然，除了这些元素，网页中还可以包含
Dreamweaver CS3网页制作基础教程第4章习题答案
项目四图像和媒体──编排旅游网页 一、填空题 1、（）作为临时代替图像的符号，是在网页设计阶段使用的重要占位工具。 正确答案：图像占位符 2、背景图像的重复方式有“不重复”、“重复”、“横向重复”及“（）”。 正确答案：纵向重复 3、如果文档中包含两个以上的Flash动画，按下（）组合键，所有的Flash动画都将进行播放。 4、（）可以使图像一幅幅地展示出来，是一种特殊形式的Flash动画。 正确答案：图像查看器 二、选择题 1、在网页中使用的最为普遍的图像格式主要是（）。 A、GIF和JPG B、GIF和BMP C、BMP和JPG D、BMP和PSD 正确答案：A 2、具有图像文件小、下载速度快、下载时隔行显示、支持透明色、多个图像能组成动画的图像格式的是（）。 A、JPG B、BMP C、GIF D、PSD 正确答案：C 3、下列方式中不可直接用来插入图像的是（）。 A、在主菜单中选择【插入】／【图像】命令 B、在【插入】／【常用】面板的【图像】下拉菜单中单击按钮 C、在【文件】／【文件】面板中用鼠标选中文件，然后拖到文档中 D、在菜单栏中选择【插入】／【图像对像】／【图像占位符】命令 正确答案：D 4、通过图像【属性】面板不能完成的任务是（）。 A、图像的大小 B、图像的边距 C、图像的边框 D、图像的第二幅替换图像 正确答案：D 5、下列方式中不能插入Flash动画的是（）。 A、在主菜单中选择【插入记录】/【媒体】/【Flash】命令 B、在【插入】/【常用】/【媒体】面板中单击图标 C、在【文件】／【文件】面板中用鼠标选中文件，然后拖到文档中 D、在【插入】／【常用】/【图像】下拉菜单中单击按钮 正确答案：D 三、问答题 1、就本项目所学知识，简要说明实现图文混排的方法。 图像【属性】面板的【对齐】选项用于调整图像周围的文本或其他对象与图像的位置关系，通过设置此选项可以实现图文混排的目的。在【对齐】下拉列表中共有10个选项，其中经常用到是“左对齐”和“右对齐”两个选项，【左对齐】表示将所选图像靠左边界排列，文本在右边围绕它排列，【右对齐】表示将所选图像靠右边界排列，文本在左边围绕它排列。 2、如果要在网页中能够播放WMV格式的视频，必须通过【属性】面板做好哪两项工
网页设计基础教程
-------------------------------------网页的结构 ----------------------------------- 一、HTML的组成结构 1、头部。 头部的HTML写法就是
头部的内容，这两个非常相似，只是后一个比前一个多了“/”符号。 2 眼睛。1、背景颜色
我们发现多了个bgcolor其实就是backgroundcolor（背景颜色）的意思，bgcolor="red"设置网页的背景颜色为红色，现在颜色一般都是#ff0000样式的。 2、背景图片 中“backgroud”就是设置背景图片的啦， back-ground.gif是背景图片的名字，为什么有的朋友也是如此写的，而网页却没有背景图片呢？其实back-ground.gif是该图片相对于这个页面的位置，比如你做的这个页面放在c:\我的网站\，而背景图片的位置放在c:\我的网站\images\，那么就得这样写了：，注意两者的区别 3、背景音乐 它的代码是放在页面的头部里 因为它也是显示网页的时候我们首先接受到的信息今天天气真好！
注意：这些一般的用在标题上，所以起名叫标题字体；网页制作学习入门教程
网页制作学习入门教程 本网页制作学习入门教程从(一)入门概念(二)设置主题(三)工具使用(四)上传网页(五)宣传与维护网页五个方面详细的介绍了网页新手必须了解的入门教程。言简意赅。值得一看。 网页制作学习入门教程(一)入门概念 WWW基本概念上WWW 你应该会了吧！这是重要的一步！不管你是用学校的网络，或是使用自己家的电脑上ISP上网，至少你要能连上网络，这样我们才能继续下去啊！有些人会搞不清楚INTERNET 和WWW 或是BBS 究竟有什么分别，以最简单的话来解释：INTERNET 是一个网络的大环境，而它拥有多项的服务项目，如：WWW、BBS、FTP、Gopher、Mail、News...等。就好象一家大的百货公司一样，有娱乐场、美食部、家电商...等的道理是一样的（只是的比喻）。现在应该知道INTERNET 和WWW 的差别了吧！WWW是20世纪90年代初兴起的一种服务。 网页：就是我们现在要准备做的东西。 首页：就是当我们进入网站时，第一眼看到的网页。 网站：由一堆网页所构成的网站内容，各个网页之间主要通过超级连接联系，这就叫网站。 WWW：则是由一堆网站所连接而成的。 简单说就是：网页→网站→WWW。 网页制作流程 为了让网友们对于网页制作有初步的概念，先简单的说一下制作网页的一般流程： 主题架构：就是网站内容主题及操作界面，先要想好。 制作工具：准备制作网页的工具、图片制作工作、网络工具等。 编写网页：开始动手，编写网页，最累最有成就感的时候。 选择空间：制作好网页就要放到网络上，得找个免费空间来放。 上传网页：有了存放网页的空间，就将制作好的网页上传到网络上。 维护网页：后续的维护网页工作，保持网页内容的新鲜度。
网页设计与制作电子教案
网页设计与制作电子教案 电子教案 课程：第1章网页制作基础课时内容教学目标网页制作基础授课时间学时数 2 ? 了解的组成和语法 ? 了解网页制作的常用软件 ? 掌握网页制作软件的启动和退出方法网页制作的一些基本知识的组成和语法 1、教学思路：首先，让同学们说说他们对网页的一个认识。然后进行系统地介绍网页是什么，由哪些部分组成，还有网页制作时所需掌握的一些基础知识和制作网页时常用到的一些软件。最后学习网页制作软件的启动和退出方法。 2、教学方法：先登录一些常用的网站，让同学们看一些网页，然后让同学们说下他们度网页的认识，最后才开始讲解本周内容。 3、教学手段：利用多媒体并结合网络进行教学。 4、教学资料及要求：课前要求学生先大致浏览本书内容，对本书所要讲解的内容有个基本的了解。教学内容讨论问题：1、什么是网页？ 2、网页的基本组成部分是哪些？3、网页有什么作用？第1章网页制作基础# 1.1 网页制作基础知识 1.1.1 网页简介 1.1.2 什么是 1.1.3 的组成结构及语法 1.1.4 应用举例——使用记事本编写网页教学重点教学难点教学设计 1.2 网页制作的常用软件 1.2.1 图形图像处理软件 1.2.2 动画制作软件 1.2.3 网页布局软件 1.2.4 软件配合及制作流程 1.2.5 应用举例——实战网页制作流程 1.3
网页制作软件的启动与退出 1.3.1 网页制作软件的启动 1.3.2 文件的打开 1.3.3 网页制作软件的退出 1.3.4 应用举例——启动并退出 Photoshop CS3 1.4 上机及项目实训 1.4.1 Flash CS3的启动与退出 1.4.2 制作“蓝莲花”网页 1.5 练习与提高本课小结 1、了解网页的组成。 2、掌握的组成结构及语法。 3、认识制作网页时常用到的一些软件4、掌握网页的基本操作（1）文档结构由哪几部分组成？ （2）制作网页时常用软件有哪些？（3）如何启动和退出Dreamweaver CS3？（4）如何打开Flash文件？（5）如何退出Photoshop？思考题及作业 电子教案 课程：第2章 Dreamweaver CS5基本操作课时内容 教学目标 Dreamweaver CS5基本操作授课时间学时数 2 ? 认识Dreamweaver CS5的工作界面 ? 掌握网页文档的基本操作方法 ? 掌握页面属性的设置 ? 掌握设置并管理站点的方法认识Dreamweaver CS5的工作界面设置页面属性和站点管理 1、教学思路：首先，让同学们认识Dreamweaver CS5的工作界面。然后进行系统地介绍网页文档制作的基本操作方法及页面的设置。最后学习对站点的管理以及设置方法。 2、教学方法：让同学们先回忆一下上节课所讲内容，然后让同学们回答网页是由哪几部分组成的，了解同学们对上一章知识的掌握程度。 3、教学手段：结合上章内容在机房内进行上机讲解。 4、教学资料及要求：课
dreamweaver简单描述制作网页的基本步骤
本教程主要是针对初学者，如何使用Dreamweaver 制作一个网页？这个教程具体详细讲解了制作网页的步骤，及注意的问题，并且拿一个实例来给大家做了一下详细讲解！ 创建网页页面 1、在Dreamveaver文件—新建—常规—基本页—HTML，这样就建好了一个页面，英 文版的默认的文件名为untitled.htm。中文版的的默认的文件名为无标题文档”。htm就表示 这个网页文件是一个静态的HTML 文件。给它改名为index.htm。 注：网站第一页的名字通常是index.htm 或index.html 。其它页面的名字可以自己取。这也就是主页，上传后打开网页默认连接到此页。 2、在标题空格里输入网页名称，点击修改—页面属性，打开“页面属性”窗口。在这里可以设置网站的标题、背景颜色或背景图像，超级链接的颜色（一般默认即可），其他都保持默认即可。 3．此时光标位于左上角，可输入一句话，如“欢迎来到我的主页”。选取文字，用菜单“窗口/属性”打开属性面板，选取文字大小为6，再使文字居中，然后在文字前用几个回车使其位于页面中间等。 4．如要选取字体，则选择字体中的最后一项：编辑字体列表。然后在对话框中选+号，接着在“可用字体”栏中选择需要加入到字体列表中的一种字体，点击中间的按钮就可以加入了。 注：在网页上最常用的是宋体字。不要将特殊的字体加到列表中使用，因为别人电脑上未装就看不到。如果需要用的话，要做成图片后再使用。 注：在网页上打入空格的办法是：把输入法调为全角。 注：在网页上换行的办法是：shift+Enter。只按Enter则为换段。 下面拿一个现成的例子来给大家讲解一下： 现在，以下边的简单网页为例，叙述一下制作过程。简单网页如下图：
- 网页设计与制作电子教案
- 静态网页制作教程(入门级)
- 项目1 网页制作基础知识答案【网页设计与制作项目教程】
- HTML基础教程(网页制作).
- Dreamweaver CS3网页制作基础教程第4章习题答案
- 项目1 网页制作基础知识答案网页设计与制作项目教程
- 网页制作基础教程
- 项目1 网页制作基础知识答案【网页设计与制作项目教程】
- 网页制作学习入门教程
- H5页面制作入门教程
- 项目1 网页制作基础知识答案【网页设计与制作项目教程】 (1)
- 网页制作教程,网页制作入门教程
- 项目1 网页制作基础知识答案【网页设计与制作项目教程】
- 网站建设与网页制作基础入门教程
- 网页设计入门
- 网页制作基础教程
- (完整word版)HTML基础教程(网页制作).
- 项目1网页制作基础知识问题详解【网页设计与制作项目教程】
- 项目1 网页制作基础知识答案【网页设计与制作项目教程】
- 项目1 网页制作基础知识答案网页设计与制作项目教程