CH5网页框架的处理.ppt

通过本章学习 应该掌握以下内容 认识框架网页创建框架网页的方法编辑框架网页的方法设置框架属性的方法 第5章网页框架的处理 5 1利用FrontPage2002处理框架 5 1 1创建框架网页1 认识框架网页框架网页是 种特殊的HTML网页 它可将浏览器窗口分成不同的区域 称为框架区域 每个区域都可以显示不同的网页 1 框架网页的特点 只要单击某一个框架区域内的超链接 其指向的网页就会在另一个框架区域中显示 而不必将整个浏览器窗口中的内容更换一遍 固定网页中的某些内容 并不是所有的浏览器都能显示框架网页 这也是框架网页的一个局限 2 框架网页的种类根据框架分布的不同和各框架作用的不同 框架网页被分为多种类型 使用FrontPage制作网页时 常用到的框架网页是 标题 标题页脚和目录 垂直拆分 横幅和目录 脚注 目录 嵌套式层次结构 水平拆分 页脚和自顶向下的层次结构 2 创建框架网页 选择 文件 新建 网页或站点 命令 打开 新建网页或站点 窗格 单击 网页模板 超级链接 打开 网页模板 对话框 单击 框架网页 选项卡 显示十种网页模板 选择其中任一种形式 在对话框右边会出现该模板形式的说明 以及模板预览 选择 嵌套式 层次结构 单击 确定 按钮 出现初始框架网页 单击每个框架中的 新建网页 按钮 各编辑区变成编辑状态 可以依次编辑各个网页 单击每一个框架区域中的 设置初始网页 按钮将打开一个对话框 可以在该对话框中选择一个网页作为框架网页最初显示的网页 并显示在框架区域中 5 1 2编辑框架网页编辑框架网页与编辑普通的网页相同 也可以在框架网页中添加和格式化文本 设置网页的背景颜色和背景图片 在网页中插入图片和添加组件 还可以调整框架的大小等 1 在框架网页中添加和格式化文本在框架网页中添加和格式化文本与在普通的网页中添加和格式化文本相同 2 调整框架的大小在输入文本时 可能输入的文本内容比较多 但框架又比较小 所以输入文本时会有一部分文本不能显示 这样在查看文本时就有可能看不到文本的整体效果 这时可以调整框架的大小来显示文本 通常调整框架的大小的方法有两种 即通过拖动框架的边框或指定想要的确切设置来调整框架的大小 1 拖动框架的边框调整框架大小将光标放在要调整的框架边框上 当光标变为 形状时 按住鼠标左键 并向下拖动 按此方法调整上图中右边两个框架的大小 调整后的框架网页如图5 7所示 2 精确设置框架大小 单击框架 将光标置于框架内 点击鼠标右键 从弹出的快捷菜单中选择 框架属性 命令 弹出 框架属性 对话框 在 框架大小 选项组中设置框架大小为固定像素数后 再指定框架的宽度和行高 单击 确定 按钮 3 拆分框架在框架网页中不但可以调整框架的大小 还可以设置网页中显示的框架的多少 在框架网页中可以任意地拆分框架 1 拖动边框拆分框架将光标放在要拆分的框架边框上 按住 Ctrl 健 同时按住鼠标左键拖动框架边框 拖出一段距离后放开鼠标左键和 Ctrl 键 出现一个框架 2 将框架平均分成两行或两列将光标放在要拆分的框架边框内 选择 框架 拆分框架 命令弹出 拆分框架 对话框 选择 拆分为行 或 拆分为列 单击 确定 按钮 4 删除框架 将光标放在要删除的框架中 选择 框架 删除框架 命令 注意 从框架网页中删除框架时 该框架中显示的网页也会被删除 但是框架网页中其余的内容并没有被删除 若框架网页仅含有一个框架 就不能删除该框架 5 为框架网页设置背景颜色和背景图片 1 设置框架网页的背景颜色 将光标放在要设置背景颜色的框架中 单击鼠标右键 从弹出的快捷菜单中选择 网页属性 命令 打开 网页属性 对话框 单击 背景 标签 打开 背景 选项卡 单击 背景 右侧的按钮 从弹出的颜色面板中选择背景颜色 单击 确定 按钮 2 设置框架网页的背景图片设置框架网页的背景图片与设置框架网页的背景颜色类似 5 1 3设置框架网页属性设置框架的属性包括设置边框的隐藏或显示 设置框架的边距和间距以及设置框架中滚动条的显示和隐藏 1 显示和隐藏框架边框可以根据所需的网页外观来选择显示或隐藏框架网页的框架周围的边框 显示和隐藏边框的操作步骤如下 将光标放在任意一个框架中 单击鼠标右键 从弹出的快捷菜单中选择 框架属性 命令 弹出 框架属性 对话框 单击 框架网页 按钮 打开 网页属性 对话框 选择或禁用 显示边框 复选框 就显示和隐藏框架边框 单击 确定 按钮 回到 框架属性 对话框 单击 确定 按钮 2 显示和隐藏框架滚动条在 框架属性 对话框中 从 显示滚动条 的下拉列表中选择 显示 或 不显示 或者 需要时显示 5 1 4在框架网页中设置超链接在框架组中设置超级链接后 单击超级链接 该链接所指向的网页通常会在另一个框架中打开 即会在目标框架中打开 在使用FrontPage2002的框架网页模板所创建的框架网页下 目标框架已经设置好了 在框架组中设置超链接与在普通的网页中设置超链接相同 也可以设置文本超链接和图片超链接 1 在框架中设置文本超链接其操作步骤如下 在框架中选择要设置超链接的文本 单击 常用工具栏 中的 插入超链接 按钮 弹出 插入超链接 对话框 选择要链接的文件 单击 目标框架 按钮 弹出 目标框架 对话框 选择目标框架 单击 确定 按钮 回到 插入超链接 对话框 单击 确定 按钮 则超链接设置完成 2 在框架中设置图片超链接在框架中设置图片超级链接与在框架中设置文本超级链接基本相同 5 1 5 保存框架网页创建和编辑完框架后就可以对框架进行保存了 保存框架与保存普通的页面方法相同 5 2其他处理网页框架的方法5 2 1利用Dreamweaver4 0处理框架网页1 建立框架Dreamweaver4 0在对象面板 Frames 框架 类中提供了许多组框架组 使用者点击鼠标就可以创建框架 2 编辑框架框架创建好以后 就可以对框架进行编辑了 每一个框架里都是一个文档 可以直接添加内容 也可以在框架内打开已经存在的文档 3 保存框架每一个框架都包含一个文档 因此一个框架集会包含多个文档 在保存文档的时候 不能只简单地保存一个文档 要将整个网页文档都保存下来 4 框架属性及框架集属性设置使用框架属性面板可以查看和设置框架的属性 5 2 2利用HTML创建网页框架1 指定框架结构在框架集网页中 除了基本的HTML HEAD等标记符以外 主要包括框架集标记符FRAMESET 必须有结束标记符 和框架标记符FRAME 没有结束标记符 由于框架是按照行或列排列的 所以在建立框架结构时 使用FRAMESET标记符的rows属性或cols属性分别可以构造出横向分隔框架和纵向分隔框架 2 框架的嵌套如果网页设计者需要创建一些复杂的框架集 即同时包含横向和纵向的框架 此时可以使用框架嵌套 框架嵌套时只要在要使用FRAME标记时再使用FRAMESET标记一个框架集即可 3 框架的初始化框架初始化是指为各个框架指定初始显示的页面 此时应使用FRAME标记的src属性 将该属性的值指定为要在框架中显示的页面即可 4 边框效果 1 框架边框的设置border属性可以用于设置边框的宽度 其值为像素数 2 框架滚动条的设置使用FRAME标记符的scrolling属性可以控制是否在框架内加入滚动条 其值可以取为yes no auto 3 设置边框的不可移动属性使用FRAME标记符的noresize属性 该属性不需要任何取值 即 4 设置框架空白FRAME标记符的framespacing属性可以控制框架边框与数据之间的距离 这个属性的取值都是像素数 5 指定超链接的目标框架控制超链接的目标文件在哪一个框架内显示的方法是在A标记符内使用target属性 格式为 超链接内容