网页设计与制作8
合集下载
网页设计与制作cs8第10章
网页设计的目的
网页设计的目的是为用户提供良好的浏览体验，使网站的内容和功能更加易于 理解和使用，同时提高网站的可用性和用户满意度，进而实现网站的商业目标。
网页设计的基本原则
用户友好性
一致性
网页设计应注重用户体验，使网站易于使 用、易于理解，并尽量减少错误和混淆。
网页设计应保持一致性，包括色彩、字体 、布局等方面，以便用户能够快速识别和 记忆网站的品牌形象。
美观性。
图像元素的设计与应用
图像选择
选择与网站主题和内容相关的图像，确保图 像质量和版权问题。
图像背景与边框
为图像添加合适的背景和边框，增强视觉效 果和吸引力。
图像大小与格式
优化图像大小和格式，提高页面加载速度， 同时保持图像清晰度。
图像动画与交互
运用图像动画和交互效果，增加页面的趣味 性和互动性。
网页风格的定位与设计
01
02
03
网页风格的类型
根据行业、目标受众和内 容的不同，网页风格可分 为简约、复古、科技感、 艺术感等多种类型。
风格定位的依据
通过对目标受众的分析、 品牌形象的塑造以及内容 呈现的需求，来确定网页 风格的定位。
设计元素的运用
运用图形、文字、色彩等 设计元素，来表达和强化 网页的风格特点。
美观度
响应式设计
网页设计应注重美观度，通过合理的色彩 搭配、图片和文字的排版等方式，提高网 站的视觉效果和吸引力。
网页设计应采用响应式设计，使网站能够 自适应不同设备和屏幕尺寸，提供良好的 用户体验。
网页设计的常用工具
Adobe Photoshop
专业的图像编辑软件，可用于设计网站的整体布局、色彩搭配、图标 等视觉元素。
网页排版的原则与技巧
网页设计的目的是为用户提供良好的浏览体验，使网站的内容和功能更加易于 理解和使用，同时提高网站的可用性和用户满意度，进而实现网站的商业目标。
网页设计的基本原则
用户友好性
一致性
网页设计应注重用户体验，使网站易于使 用、易于理解，并尽量减少错误和混淆。
网页设计应保持一致性，包括色彩、字体 、布局等方面，以便用户能够快速识别和 记忆网站的品牌形象。
美观性。
图像元素的设计与应用
图像选择
选择与网站主题和内容相关的图像，确保图 像质量和版权问题。
图像背景与边框
为图像添加合适的背景和边框，增强视觉效 果和吸引力。
图像大小与格式
优化图像大小和格式，提高页面加载速度， 同时保持图像清晰度。
图像动画与交互
运用图像动画和交互效果，增加页面的趣味 性和互动性。
网页风格的定位与设计
01
02
03
网页风格的类型
根据行业、目标受众和内 容的不同，网页风格可分 为简约、复古、科技感、 艺术感等多种类型。
风格定位的依据
通过对目标受众的分析、 品牌形象的塑造以及内容 呈现的需求，来确定网页 风格的定位。
设计元素的运用
运用图形、文字、色彩等 设计元素，来表达和强化 网页的风格特点。
美观度
响应式设计
网页设计应注重美观度，通过合理的色彩 搭配、图片和文字的排版等方式，提高网 站的视觉效果和吸引力。
网页设计应采用响应式设计，使网站能够 自适应不同设备和屏幕尺寸，提供良好的 用户体验。
网页设计的常用工具
Adobe Photoshop
专业的图像编辑软件，可用于设计网站的整体布局、色彩搭配、图标 等视觉元素。
网页排版的原则与技巧
网页设计与制作——Dreamweaver 8第7章 创建动态网页
7.2 创建动态网页
案例7-2 制作会员注册动态网页
【操作步骤】 2、制作新用户已存在网页 （1）打开本地根文件夹下的“sucai07-html”，将其另存为 cunzai-html，打开该文档。 （2）插入2行3列的表格 。 （3）分别输入文字“对不起，您所填写的用户名已存在！ “和“请重新进行注册！” 。 （4）为“请重新进行注册！” 创建导向zhuce-asp 的超链接 。 （演示操作）
第7章 创建动态网页
技能目标 7.1 数据库的创建与连接 7. 2 创建动态网页
技能目标
1. 2. 3. 4. 了解制作动态网页的基本知识 掌握表单的制作 掌握动态网页制作的基本方法与技巧 掌握动态网页的发布及数据库的链接
7.1 数据库的创建与连接
动态页面是在后台数据库的基础上创建 的，因此数据库的创建和连接对于动态网页 是否能够正常工作起着极其重要的作用。数 据 库 的 种 类 非 常 多 ， 例 如 Access 和 SQL Server 等，本节将以在 Access 数据库中创建 会员注册登录系统为例来介绍如何创建和连 接数据库。
案例7-2 制作会员注册动态网页
案例小结： 表单是网站中实现网页上数据传输的基础。 利用表单的多种允许进行交互的对象，包括文本 域、列表框、复选框、单选按钮、图像域、按钮 等，可以为网站收集访问者输入的信息，实现网 站的交互性。
课堂小练习： 将本节实例中的会员注册系统换成一个留言 板，自己动手练习表单的使用方法 。
7.2 创建动态网页
动态网页的重要组成元素是表单，表 单支持客户端－服务器关系中的客户端。 当访问者在Web浏览器（客户端）中显示的 表单中输入信息，然后单击提交按钮时， 这些信息将被发送到服务器，服务器中的 服务器端教本或应用程序会对这些信息进 行处理。服务器向用户（或客户端）返回 所请求的信息或基于该表单内容执行某些 操作，以此进行响应。经常在网站上看到 的会员注册和登录、在线调查、在线搜索 等都属于这种情况。
网页设计与制作cs8 第1章
5
2.退出Dreamweaver 2.退出Dreamweaver 8.0 退出 退出Dreamweaver 8.0的方法很简单，我们可以有以下几 种方式退出编辑界面： （1）单击Dreamweaver 8窗口右上方的关闭按钮； （2）按下“Alt+F4”组合键； （3）选择“文件”菜单中的“退出”命令，或按快捷键 Ctrl+Q退出系统。
9
步骤3:单击“管理站点”对话框中的“新建”按钮， 在弹出菜单中选择“站点”命令。
10
步骤4：单击“站点”命令后，系统会弹出窗口，这是 一个定义站点的向导，选择“基本”选项卡，给网站 定义一个名称，例如“数学与计算机系”。
11
步骤5：单击“下一步”按钮，在窗口中设置网站是否 使用服务器技术，例如：ASP、PHP等。由于我们要制 作的是基本的静态网站，所以选择“否，我不想使用 服务器技术”单选按钮。
1．创建文件夹和文件 文件面板通常显示站点中的所有文件和文件夹，但新建 的站点中不包含任何文件或文件夹。所有的文件和文 件夹都需要新建，在文件面板中站点根目录上单击鼠 标右键，然后从弹出的快捷菜单中单击菜单项“新建 文件夹”或“新建文件”，接着给新的文件夹或文件 命名。
20
建立站点目录的几个要求： 建立站点目录的几个要求：
3
1.1 Dreamweaver 8.0简介
8.0的启动和退出 1.1.1 Dreamweaver 8.0的启动和退出 8.0的工作环境 1.1.2 Dreamweaver 8.0的工作环境
4
8.0的启动和退出 1.1.1 Dreamweaver 8.0的启动和退出
1.启动Dreamweaver8.0 1.启动Dreamweaver8.0 启动 在Windows操作系统下，单击左下角的【开始】按钮，从 【程序】菜单中选择Macromedia菜单，然后从子菜单 中单击【Macromedia Dreamweaver 8】即可启动，如 图所示。
DreamWeaver8教学大纲
《网页设计与制作》教学大纲一、课程基本信息（宋体小四号加粗）课程名称：网页设计与制作课程代码：glx04课程性质：公共选修课学分数：2学分学时数：32学时适用专业：全校各专业先行课：计算机文化基础后续课：动态网页设计二、课程地位和任务《网页设计与制作》是一门操作性和实践性很强的课程,为网络专业和计算机相关专业的必修课。
本课程的主要内容包括了网页编辑与制作软件Dreamweaver 8建站的全过程。
教材体现网页制作技术的的特点，注重实用性和操作性,综合讲述了网页制作中的网页编辑、Web图像制作以及网页中动画设计的基本概念和基本操作技能。
书中文字叙述简单明了、通俗易懂。
按照Adobe 公司出品的网页制作系列软件的系统内容，由浅入深、循序渐进，符合学习者的认知规律。
书中列举了部分实例，各章都编排了适量的习题、思考题，以使学生更好地理解和掌握书中所讲述的内容。
三、课程基本要求课程在重点介绍网页设计软件Dreamweaver 8的操作与应用的基础上，通过大量实例和光盘教学素材，详细地阐述了网页设计软件的应用技巧，使学生在学习过程中得以融会贯通，掌握网页设计软件的高级应用。
同时，授课过程中将始终遵循“用户界面感受第一”的基本原则，教导学生在策划、设计过程中设身处地为用户着想，让创意为用户服务，培养学生独立思考、独立创作的良好学习习惯，为学生成为一名优秀的网页设计师打下坚实的基础。
课程设置的根本思路是为使学生能够最大程度满足企业对于网页设计人员的需求，达到学以致用的目的，从而为企业培养优秀的网页设计实用人才。
四、课程内容及学时分配第一章 Dreamweaver 8概述一、教学目的与要求掌握：Dreamweaver 8的界面组成及面板组的使用方法理解：有关网页设计的基本概念了解：Dreamweaver 8的新增功能二、教学难点与重点重点：如何建立网站站点难点：网站站点建立三、教学时数2学时四、教学过程与教学内容1.Dreamweaver 8的新功能2.Dreamweaver 8 的工作区3.使用窗口和面板4.站点建立第二章创建网页文档一、教学目的与要求掌握：创建文档的基本方法理解：文档的基本属性了解：文档的基本类型二、教学难点与重点重点：文本和文档属性的设置难点：属性的设置三、教学时数2学时四、教学过程与教学内容1.创建、打开、保存文档2.设置文本和文档属性3.在文档窗口中选择元素第三章图像的使用一、教学目的与要求掌握：图像的基本方法，并能够编辑插入到文档中的图像，以及设置它们的属性。
网页设计与制作8
8.2.5 插入Flash Video
Flash Video即Flash视频，它的后缀名为：.flv，是 目前广泛流行的一种视频文件格式。一般的视频文件：asf、 wmv、rm等都需要专门的播放器来支持视频文件的播放，否 则根本无法收看，并且这类文件容量过大，下载慢，查看 也不很流畅。为了解决播放器和容量的问题，可以将各类 视频文件转换成Flash视频文件，即Flv格式。经过编码后 的音频和视频数据，通过Flash Player传送。 单击“插入”栏｜“常用”选项｜“媒体”｜“Flash Video”按钮，或选择“插入”菜单｜“媒体”｜“Flash Video”命令，弹出“插入Flash视频”的对话框，如图8.6 所示。设置Flash Video的相关参数。
8.2.8在网页中嵌入音频文件
在网页中加入背景音乐虽然简便，但是缺乏对音频文件的控制能 力，比如浏览者不想听到背景音乐时，却无法使播放的声音停下来， 并且背景音乐所支持的音频文件格式有限。因此可以媒体插件的方式 嵌入声音文件。 网页中的音频文件格式为：mid、wav，几乎所有的浏览器都支持 这两种声音格式，所以客户端无需插件即对其支持，另外还有mp3、 rm、mwv、mov等。 单击“插入”栏｜“常用”选项｜“媒体”｜“插件”按钮，弹 出“选择文件”的对话框，选择音频文件的路径，单击“确定”按钮。 文档窗口出现插件占位符，选中插件占位符，拖动占位符四周的 控制点，可调整播放器界面的尺寸，如图所示。 选中插件占位符，单击“属性”面板中“参数”按钮，弹出参数 对话框，或在“插件”标签检查器中，设置相关的参数，如图8.10所 示。
《网页设计与制作》
第八章 在网页中插入多媒体对象
8.1 8.2 8.3
实例导入：多媒体站点
使用多媒体对象 多媒体网站实例的制作过程
网页设计与制作8
8．2．4 铅笔工具和刷子工具
1．铅笔工具 铅笔工具主要用于绘制线条和任意形状的曲线， 具体操作如下： （1）单击工具箱中的【铅笔工具】按钮，当鼠标 移动到舞台中就会变成铅笔形状。 （2）按住鼠标左键拖曳，即可画出相应的图形。 当单击【铅笔工具】后，在工具箱的选项区中将 出现铅笔工具模式的选项按钮，如图8-12所示， 该按钮下拉框中有以下三个选项。
(3)【颜色】区域：该区域提供了笔触颜色和填充颜 色的设置按钮，以及笔触颜色和填充颜色取消按钮、 黑白颜色按钮和交换黑白颜色的按钮，如图8-2（b） 所示。 Байду номын сангаас4)【选项】区域：该区域可以根据所选的不同工具， 提供这些工具不同的附属功能，有附属功能的工具按 钮如图8-3所示。
图8-1【工具】区域
8．2．2 矩形工具和椭圆工具
1．矩形工具 矩形工具可用来绘制矩形、正方形、圆角矩形、星形和多 边形。 单击工具箱中的【矩形工具】按钮，工具箱中的颜色区域 和选项区域出现矩形工具的相应选项，在舞台下方出现 【矩形工具】的【属性】面板，如图8-6所示。 绘制矩形的操作步骤如下： （1）单击工具箱中的【矩形工具】按钮。 （2）在【颜色】区域中设置【矩形工具】的笔触颜色和 填充色。若绘制一个空心矩形，单击【颜色】区域中的按 钮封闭【颜色】区域中的填充色。若绘制一个无框线矩形， 用同样的方法将笔触颜色设置为无。
2）移动、复制对象的操作 （1）移动对象：单击工具箱中的【选择工具】按 钮，单击舞台中需移动的对象，当鼠标箭头变成 右下角带有十字箭头的形状时，拖曳对象到目标 位置。 （2）复制对象：单击工具箱中的【选择工具】按 钮，单击舞台中需复制的对象，按Ctrl键，当鼠标 箭头变成右下角带有空心的十字的形状时，拖曳 对象即可复制一个副本。
网页设计与制作第八章
实训一
实训目的 通过制作礼花动画，加强对利用“动画元 件”制作动画方法的认识。
制作步骤： ①新建一文档，画布大小为 200 * 200象素，底色为黑 色(#000000)。 ②用画圆工具画一个圆形，大小为 10 * 10象素，填充 为“无”，笔触的颜色设置为“#66FF00”（可以选 择一个自己喜欢的，饱和度高一些的颜色）
8.2.创建动画
将绘制完成的图形对象制作成动画效果， 可以通过逐步建立帧来实现， 也可以通过转换成“动画元件”， 然后利用动画设置框来实现； 还可以将图像转为“图像元件”后， 通过“补间实例”功能来间接实现。
一.逐帧动画
最简单的动画就是“逐帧动画”，它的制 作方法是最简单的，即通过建立帧，并在 每帧上放置不同的图象，下面就通过制作 一个动感Banner来学习。 ①新建一个500*92象素的画布，并用矩形工 具拉出一个与画布一样大小的矩形。 ②将矩形的填充选为 “波纹” 渐变，渐变 颜色可以根据自己的喜欢设定，在这里为 “#FFB64A”与 “#FFFFFF”的交替，如图示。
而原来画布中的图像左下角则会多出一个小箭头标志， 表明这是该“图形元件”的一个分身
②从“库”面板中用鼠标将该“图形元件”拖拽至画布 当中，为 该“图形元件”建立第二个分身对象。同时 选中这两个分身对象后，在任意一个分身对象上点击鼠 标右键，并从弹出菜单中选择“元件”→“补间实例” 命令，从而启动“补间实例”对话框：
③选择制作好的圆形，按 F8 键调出元件属性对话框， 在其中选择“动画”，将图形转换成“动画元件”， 点击“确定”后，在打开的动画设置对话框中，设置 制作动画帧数为“6”，缩放为“800”，不透明度分 别为“100”，“0”的属性，其他的属性都设置为 “0”。
网页设计与制作课程课程大纲
xxx学校课程大纲科目名称：《网页设计与制作》专业：计算机说明随着互联网的高速发展和广泛传播，对从事网页设计与制作的人员需求量也愈来愈多。
教材在教学过程中起着至关重要的作用，而缺乏优秀实用的网页设计与制作方面的教材是目前中职学校普遍存在的问题。
本书编者旨在为中职学校相关专业，以及对网页设计与制作有兴趣的人员提供一本实用教程。
本书是依据网页设计行业的业内制作标准和相关案例执行为范围编写的。
在编写过程中针对读者的特点，项目选择合理、针对性强、理论和实践有机融合；以实践为主，特别注重实用性，并注重融入先进的教学理念与方法，注重提高读者的学习能力。
全书从实用的网页设计制作项目入手，以任务驱动的方式系统地介绍了以下内容：网站的制作流程、使用HTML制作简单网页、认识Dreamweaver CS3、搭建与管理本地站点、网页元素的编辑、使用CSS控制页面元素、使用表格布局制作页面、使用框架布局制作网页、使用CSS+DIV布局页面、使用模板和库提高制作效率、使用JAVAScript制作网页特效、策划与制作个人艺术网站。
同时结合作者多年来积累的教学工作经验，以实践为主，理论融合其中，是帮助教师联想三大软件、提高学生实践力的有力助手。
通过课程学习，学生将具备网页设计与制作的基本技能，并帮助学生在从业道路上积累经验。
本教材还具备一下特点：1.任务明确；2.结构新颖；3.图文并茂，简洁易懂；4.与国家职业资格证接轨。
《网页设计与制作》课程教学大纲课程名称：《网页设计与制作》课程总学时：72一、教学目的和任务（一）目的《网页设计与制作》是计算机相关专业的一门应用性较强的选修课程。
通过对网页设计与制作的初步学习，使学生对网页设计与制作的各个环节有感性的认识并理性理解各个网页中各布局的功能和特点，学习网页设计与制作制作方法，为今后在网页设计与制作行业工作提供必要的基础知识，以便能够得心应手地使用好Dreamweaver软件，更好地使设计网页发挥作用。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
4．删除框架 ．
将光标放在框架的边框上， 将光标放在框架的边框上 ， 当光标变成垂直箭头 或水平箭头） 按住鼠标左键， （ 或水平箭头 ）时， 按住鼠标左键，将框架的边框拖 出父框架或页面之外，即可将这个框架删除。 出父框架或页面之外，即可将这个框架删除。
№9
网页设计艺术
8.2.2 编辑框架网页
框架创建好以后，就可以对框架进行编辑了。 框架创建好以后， 就可以对框架进行编辑了。每 一个框架里都是一个文档，可以直接添加内容， 一个框架里都是一个文档，可以直接添加内容， 也可 以在框架内打开已经存在的文档。 以在框架内打开已经存在的文档。
网页设计艺术
第8章 利用框架技术制作网页 章 通过本章学习，应该掌握以下内容： 通过本章学习，应该掌握以下内容： 1. 2. 3. 4. 认识框架网页 创建框架网页的方法 编辑框架网页的方法 设置框架属性的方法
№1
网页设计艺术
8.1 认识框架网页
框架网页是一种特殊的HTML 网页 框架网页是一种特殊的 HTML网页 ， 它可将浏览 HTML 网页， 器窗口分成不同的区域，称为框架区域。 器窗口分成不同的区域，称为框架区域。每个区域都 可以显示不同的网页。 可以显示不同的网页。 在框架网页中，用来分隔网页的窗格称为框架。 在框架网页中，用来分隔网页的窗格称为框架。 每个框架包括框架高度、框架宽度、 每个框架包括框架高度、框架宽度、滚动条和框架边 此外还可指定框架的内边距（ 框，此外还可指定框架的内边距（框架与网页正文之 间的距离） 间的距离）。
№ 16
网页设计艺术
8.2.5 设置框架中的链接目标
在框架网页中建立超链接的操作步骤如下： 在框架网页中建立超链接的操作步骤如下： 选中要创建超链接的文本（ 或图像） （ 1 ） 选中要创建超链接的文本 （ 或图像 ） ， 打开其 属性面板。 属性面板。 链接”文本框中输入要链接文件的URL地址， URL地址 （2）在“链接”文本框中输入要链接文件的URL地址， 选取要链接的文件。 或单击按钮 ，选取要链接的文件。 单击“目标”下拉列表，选择一种框架名称， （3）单击“目标”下拉列表，选择一种框架名称， 链接文件将在该框架中打开。 链接文件将在该框架中打开。 保存框架网页，浏览页面。 （4）保存框架网页，浏览页面。
№ 18
网页设计艺术
8.3.2 框架结构的定义 1．指定框架的结构 ．
演示编辑框架网页
№ 10
网页设计艺术
8.2.3 保存框架网页
每一个框架都包含一个文档， 每一个框架都包含一个文档 ，因此一个框架集会 包含多个文档。在保存文档的时候， 包含多个文档 。在保存文档的时候，不能只简单地保 存一个文档，要将整个网页文档都保存下来。 存一个文档，要将整个网页文档都保存下来。
№5
网页设计艺术 执行以下操作之一，即可创建框架。 （3）执行以下操作之一，即可创建框架。 • 选择 “ 插入 ” |“框架 ” 命令 ， 从弹出的子菜单中选 选择“ 插入” 框架 命令， 框架” 择任意一个选项。 择任意一个选项。 • 选择 “ 修改 ” |“框架页” 命令 ， 从弹出的子菜单中 选择“ 修改” 框架页 命令， 框架页” 选择任意一个选项。 选择任意一个选项。 • 单击插入 “ 框架 ” 面板上的任一种插入框架图标按 单击插入“ 框架” 钮。
№ 11
网页设计艺术
8.2.4 框架属性及框架组属性设置 1．框架属性 ．
利用框架属性面板可以查看和设置框架的属性， 利用框架属性面板可以查看和设置框架的属性 ， 如为框架命名、设置框架的边框及颜色等。 如为框架命名、设置框架的边框及颜色等。 首先选择“ 窗口” |“其它 ” |“框架 ” 命令， 或 首先选择 “ 窗口 ” 其它” 框架” 命令 ， 其它 框架 按快捷键“ Shift+F2 ， 打开“框架”面板； 按快捷键 “ Shift+F2”，打开 “ 框架 ” 面板 ； 然后 在框架面板中选中框架， 在框架面板中选中框架 ， 此时属性面板所显示的 即为框架的属性面板，如图所示。 即为框架的属性面板，如图所示。 在框架属性面板中设定框架的属性。 在框架属性面板中设定框架的属性。
№ 14
网页设计艺术 （1）设置框架边框的属性
4．设置框架和框架组的边框 ．
设置框架边框属性的步骤如下： 设置框架边框属性的步骤如下： 在文档窗口按住Alt Alt键 然后单击一个框架， ① 在文档窗口按住Alt键，然后单击一个框架，或通 框架”面板来选择一个框架。 过“框架”面板来选择一个框架。 ② 在框架属性面板上的 “ 边框 ” 下拉列表项中选择 在框架属性面板上的“边框” 任意一个选项。 任意一个选项。 ③ 在“边框颜色”文本框中设置当前框架的边框颜 边框颜色” 色，也可单击其后面的按钮 板来选择所需颜色。 板来选择所需颜色。
№ 12
网页设计艺术
2．框架组属性 ．
新创建的框架组默认属性值为： 无边框， 新创建的框架组默认属性值为 ： 无边框 ， 无滚动 在浏览器中无法看到创建的框架， 条，在浏览器中无法看到创建的框架，要改变这些属 需在属性面板中修改相应的选项。 性，需在属性面板中修改相应的选项。 首先单击框架的边框，选中框架组， 首先单击框架的边框 ， 选中框架组 ， 此时属性面 板中将自动切换显示框架组的属性，如图所示。 板中将自动切换显示框架组的属性，如图所示。 在框架组属性面板中设定框架组的属性。 在框架组属性面板中设定框架组的属性。
№ 13
网页设计艺术
3．设置框架的大小 ．
调整框架尺寸可以拖动框架的边框来调整， 调整框架尺寸可以拖动框架的边框来调整，但在需 要精确定义框架尺寸的大小时， 要精确定义框架尺寸的大小时，可以在属性面板中 进行框架尺寸的设置。设置框架尺寸的步骤如下： 进行框架尺寸的设置。设置框架尺寸的步骤如下： 单击框架边界，选定一个框架组。 （1）单击框架边界，选定一个框架组。 选择“窗口” 属性 命令， 属性” （ 2 ） 选择 “ 窗口 ” |“属性” 命令 ， 打开框架组属性 面板。 面板。 单击框架组属性面板右侧图框中的区域， （ 3 ） 单击框架组属性面板右侧图框中的区域 ， 选定 框架组中的行或列。 框架组中的行或列。 文本框中输入调整框架尺寸的数值， （ 4 ） 在 “ 值 ” 文本框中输入调整框架尺寸的数值 ， 然后在“单位”下拉列表框中选择一种度量单位。 然后在“单位”下拉列表框中选择一种度量单位。
№7
网页设计艺术
3．选择框架 ．
（1）选择整个框架 要选择整个框架可执行以下操作之一： 要选择整个框架可执行以下操作之一： 将鼠标指针移到整个边框位置的同时，按住Alt Alt键 ① 将鼠标指针移到整个边框位置的同时，按住Alt键，当鼠 标指针变为垂直箭头（或水平箭头） 标指针变为垂直箭头（或水平箭头）时，单击边框即可选 中整个框架。 中整个框架。 如果当前选择的是一个子框架，需要重新选择整个框架， ② 如果当前选择的是一个子框架 ， 需要重新选择整个框架 ， 可以将鼠标指针移到第一次分割框架的边框位置， 可以将鼠标指针移到第一次分割框架的边框位置，当鼠标 指针变为垂直箭头（或水平箭头） 指针变为垂直箭头（或水平箭头）时，单击边框即可选中 整个框架组。 整个框架组。 除了上述方法之外，选择框架还可以通过“框架” ③ 除了上述方法之外，选择框架还可以通过“框架”面板 来完成。 来完成。
№2
网页设计术
1．框架网页的特点 ．
（1）只要单击某一个框架区域内的超链接，其指 只要单击某一个框架区域内的超链接， 向的网页就会在另一个框架区域中显示， 向的网页就会在另一个框架区域中显示，而不必将整 个浏览器窗口中的内容更换一遍。 个浏览器窗口中的内容更换一遍。 （2）固定网页中的某些内容。 固定网页中的某些内容。 并不是所有的浏览器都能显示框架网页， （3）并不是所有的浏览器都能显示框架网页，这 也是框架网页的一个局限。 也是框架网页的一个局限。
№3
网页设计艺术
2．框架网页的结构 ．
根据框架分布的不同和各框架作用的不同， 根据框架分布的不同和各框架作用的不同，框 架网页被分为多种类型。常用到的框架结构有： 架网页被分为多种类型。常用到的框架结构有：左 侧框架、右侧框架、顶部框架、底部框架、上方和 侧框架、右侧框架、顶部框架、底部框架、 下方框架以及各种嵌套框架结构。 下方框架以及各种嵌套框架结构。
№4
网页设计艺术
8.2 利用Dreamweaver MX处理框架 利用 处理框架
8.2.1 创建框架网页 1. 建立框架
MX中创建框架的具体操作步骤如下 中创建框架的具体操作步骤如下： 在 Dreamweaver MX中创建框架的具体操作步骤如下： 选择主菜单中的“ 文件” 新建 命令， 新建” （ 1 ） 选择主菜单中的 “ 文件 ” |“新建” 命令 ， 打开一个 新文档窗。 新文档窗。 将插入面板切换到“ 框架” 插入面板如图所示。 （ 2 ） 将插入面板切换到 “ 框架 ” 类 ， 插入面板如图所示 。
№ 17
网页设计艺术
8.3
利用HTML创建网页框架 利用HTML创建网页框架 HTML
8.3.1 利用 利用HTML创建框架网页 创建框架网页
利用HTML 创建框架网页时首先要指定框架结构。 利用 HTML创建框架网页时首先要指定框架结构 。 HTML 创建框架网页时首先要指定框架结构 即必须有一个网页用于指定整个浏览器窗口如何划分， 即必须有一个网页用于指定整个浏览器窗口如何划分， 也就是所谓的框架集网页。在框架集网页中不包含任 也就是所谓的框架集网页。 框架集网页 何可显示的内容， 何可显示的内容，而只是包含如何组织各个框架的信 息和框架中的初始页面信息。 息和框架中的初始页面信息。
№8
网页设计艺术 （2）选择子框架 在文档窗口中按住Alt Alt键 在文档窗口中按住 Alt键， 然后用鼠标单击欲 选择的子框架。 选择的子框架 。文档窗口中该子框架的周围被虚线包 表示它已经被选中， 围 ， 表示它已经被选中 ，同时在状态栏上加黑显示标 记符<frame> <frame>。 记符<frame>。 同样也可以通过“ 框架” 面板来选择子框架。 同样也可以通过 “ 框架 ” 面板来选择子框架 。 只 要在框架面板中单击相应的子框架即可