第10章框架.ppt

学习目标 1 掌握在网页中插入框架及属性设置2 掌握利用框架布局3 了解框架的概念 第十章框架的建立与应用 教学重点和难点重难点 框架属性设置 重点 难点 重点 框架中链接目标的设置 重点 任务一 框架与框架集的概念1概念 框架 将浏览器窗口划分为若干个区域 每个区域可以分别显示不同的网页 HTML文档 框架集 用来定义整体的框架布局 但并不提供实际内容 保存页面中框架的数量 尺寸 位置以及每个框架的网页源文件和其他可定义的属性 左框架 右框架 它实际上包含3个独立的文件 一个框架集文件 两个框架文件 2框架的缺点a 不是所有的浏览器都支持框架 b 框架的实现实际上是把几个HTML文件在同一个页面内显示 因此在下载时比较慢 c 由于框架把一个网页分为几个部分 每个网页的可用空间就变小了 任务二 框架的基本操作创建框架集1 创建自定义的框架集单击菜单 修改 框架集 拆分上 下 2 手动绘制框架a 新建一html文件b 单击菜单 查看 可视化助理 框架边框 c 直接拖动框架集边框 按住ALT键拖曳一条框架边框可以垂直或水平分割文档 按住ALT键 2 插入预定义的框架集Dreamweaver预定义了13中框架集 在 布局 选项卡中单击 框架集 图标的下拉菜单 从中选择一种框架集类型 3 文件 新建 框架页 二删除框架任意拖动框架边框离开页面或拖动到其他框架的边框上 三选择框架与框架集1 在框架面板中选择框架与框架集2 在文档窗口选择框架选择框架 在文档窗口某个框架内按Alt键并单击选择框架集 在文档窗口单击某个框架边框 可选择该框架所属的框架集 四保存框架与框架集1 保存框架 在框架内单击 然后选择菜单 File Save 2 保存框架集文件 选中框架集 选择 文件 保存框架集 任务三 设置框架 集 的属性1 设置框架的属性 FrameName 框架名 框架名应该是一个单词 以字母开头 允许使用下划线 英文小写字母 Src 源文档 用来在当前框架中打开的源文件 网页文件 也可以把光标置于框架内 然后选择 文件 在框架中打开 Scroll 滚动条 用来设置当没有足够的空间来显示当前框架内容时是否显示滚动条 Yes 显示滚动条 No 不显示滚动条 Auto 当没有足够的空间时才显示滚动条 Default 采用浏览器默认值 一般为Auto NoResize 禁止调整大小 框架在浏览时是否可以移动 若要使边框移动 则要同时设置拥有该边框的框架都设置为可移动 Borders 边框 BorderColor 边框颜色 BordersWidth Height 空白宽度 高度 以象素为单位设置框架边框与框架内容之间的左右 上下 距离 2 框架集的属性设置框架属性会覆盖在框架集中设置的属性 Borders 边框 设置当文档在浏览器中被浏览时是否显示框架边框 其中 Yes 要显示边框 No 不显示边框 Default 让用户的浏览器决定是否显示边框 BorderWidth 边框宽度 输入一个数字以指定当前框架集的宽度 BorderColor 边框颜色 设置当前框架集中所有边框的颜色 0表示无边框 Value 值 指定所选择行 高度 或列 宽度 的大小 用来设置框架的大小 单位指定所选择的行或列是以相素为单位的固定大小 还是显示为浏览器的百分比 还是扩展或缩小以填充窗口中的剩余空间 任务四 利用框架功能制作主页 实例 在使用框架网页时需要掌握2个方面的技巧 框架链接目标的控制 框架网页外观的设置 控制框架链接目标 例如当访问者单击左面框架中的链接时 目标在右面框架中打开 包含2个关键步骤 一是给框架命名 二是指定超级链接的框架目标 要使用链接目标跳出当前框架结构 可指定 top链接目标 框架网页外观的设置主要通过调节框架和框架集的属性实现 创建框架网页示例 步骤 1 在页面中创建框架集和框架 2 保存框架集文件和框架文件 要注意的是 每个框架和框架集都是独立的网页 需要单独保存 3 设置框架集和框架的属性 包括命名框架和框架集 设置是否允许框架页面内容滚动 是否显示框架等 4 确认连接的目标框架设置 使所有连接内容都出现在正确的区域内 5 要改变框架中网页的属性 可先选中 再单击菜单 修改 页面属性 任务五 创建NoframesDW允许创建非框架的内容 供不支持框架的浏览器显示这是非框架的内容可以通过 修改 框架集 编辑非框架的内容 来定义非框架的内容 任务六 iframe在网页中的作用作用 对网页的内部对象进行划分 如表格等 而外部框架主要应用于整体网页文档 是将整个网页划分多个区域 格式 归纳总结 通过本章的学习 通过框架布局页面 框架以及框架集的创建 其属性的修改 针对浏览器版本较低创建Noframes iframe内嵌框架在网页中的作用 作业