网页设计建立框架网页
边框调整框 架的大小。 6、“边框”
设置框架是否有边框。可选择的项目有“是”、“否”、“默认”。框架边 框的设置会优先于框架结构属性中边框的设置。在大多数情况下,不应该让框 架网页出现边框。 7、“边框颜色”
设置框架边框的颜色。对框架的边框颜色的设置要优先于对框架集边框颜色 的设置。框架颜色的设置会影响到相邻框架边框的颜色。 8、“边界高度”和“边界宽度”
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
下面介绍框架网页的设计和超级链接的目标窗口设定步骤: 1、建立框架集 选择“文件” ――> “新建” ――>“框架集” ――>“垂直拆分” ――>“创建”。 2、在左边框架中布局七行一列表格,内容如下:
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
在右边框架中输入文本信息。 3、保存框架页
选择“文件”一“保存全部”,当前被保存的网页周围会被条纹线圈起 来。框架集页命名为main.htm,左、右边框架页分别命名为left.htm、 right.htm。 4、设置框架属性
按住键盘Alt键的同时单击左边的框架,左边的框架被选中。左边框架属 性的设置如图
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
另外一种方法是通过菜单插入预设的框架形式。 1、在网页编辑窗口下,选择“插入”一>“HTML”一>“框架”命令。 2、弹出预设的框架形式,在拆分形式中进行选择,网页就会按预设的形式进行 拆分。
上一页
下一页
项目9 建立框架网页
网页设计建立框架网页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
教学目的 1、了解框架网页的结构特点; 2、掌握框架网页的创建、保存方法; 3、熟练设置框架属性、框架集属性及超级链接目标框架位置; 4、能独立运用框架结构布局网页;
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
教学内容 教学目的 教学重点 教学难点 教学过程
要创建新的空预定义框架集,请执行以下操作: 1、选择“文件”>“新建”。 2、在“新建文档”对话框中,选择“框架集”类别,从“框架集”列表选择框 架集。 单击“创建”。 如图:
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
保存框架中文档 在框架中单击,然后选择“文件”>“保存框架”或选择“文件”>“框
架另存为”,如图:
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
二、框架属性与框架集的属性的设置与调整
(一)使用框架面板 “框架”面板提供框架集内各框架的可视化表示形式。在“框架”面板中,
(二) 自主创建框架 自主创建框架包括两种方法。
第一种方法是使用鼠标拖动框架。 另外一种方法是通过菜单插入框架结构。 (三) 创建嵌套框架 创建嵌套框架的操作如下: 1、将光标放置于要插入嵌套框架的已有框架中。 2、然后在编辑窗口中选择“修改”一>“框架页”,在“拆分左框架”、“拆 分右框架”、“拆分上框架”和“拆分下框架”中进行选择。
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
1、左上角的预览区域显示当前框架集结构。 2、“边框”设置框架是否有边框。“是”为有边框,“否”为无边框, “默认”为浏览器决定是否有边框,对于大多数浏览器而言,这一项都意味 着有边框。对于这一项,框架集的设置如果和框架的设置相冲突,以框架属 性的设置为优先。 3、“边框宽度”:设置框架结构中边框的宽度,单位是像素。 4、“边框颜色”:设置边框的颜色,可以单击颜色框,打开取色面板,进 行选择。 5、设置框架结构的拆分比例。拆分的形式是上下拆分,将显示“行”。拆 分的形式是左右拆分,则显示“列”。选择后会在“值”和“单位”两项出 现该框架对应的值。
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
(二) 修改框架属性 在框架面板上或者在编辑窗口中选中框架,打开属性面版,如图所示:
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
框架属性的设置如下: 1、首先从属性面板左上角图标,可以确定当前选中的是框架。 2、“框架名称” 给当前选中的框架命名。可以根据框架在整个框架网页中的位置命名,比如在上 面的叫做up,在左面的叫做left。也可以根据内容,放置导航条的叫做navi,放 置主要内容的叫做main,等等。 3、“源文件”
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
设置无框架内容的步骤是: 1、在框架网页的编辑窗口下,选择“修改”――> “框架页” ――> “编辑无框架内容”,这时网页框架消失,出现完整的编辑 窗口,窗口上方标注“无框架内容”。 2、和编辑普通网页一样,编辑无框架时显示的内容。 3、完成无框架内容编辑后,再次选择“修改” ――>“框架 页”――>“编辑无框架内容”,退出编辑无框架内容状态。
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
要在“框架”面板中选择一个框架集,请执行以下操作: 在“框架”面板中单击环绕框架集的边框,框架集周围都会显示一个粗线
条的选择轮廓,如图:
1、框架网页的拆分与保存;
教学重点
2、框架与框架集属性的意义与设置;
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
教学难点 1、 理解超级链接目标框架属性的意义与设置方法
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
一、框架网页的建立与保存 (一) 使用预设方式创建框架 1、在站点管理器下,选择“文件”一>“新建窗口”,新建网页窗口。 2、将光标放在网页之中。 3、打开“插入”工具栏的“布局”选项卡中,单击“框架”按钮,在弹出的下 拉菜单中,单击合适的框架按钮如图所示。
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
“框架名称”为left,“滚动”选择“否”,这样,即使是在浏览器窗口 缩小的时候,这个框架也不会出现滚动条。选中“不能调整大小”。
按住键盘Alt键的同时单击右边的框架,右边的框架被选中。 右边 框架属性的设置如图所示:
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
(四) 保存框架和框架集中的文件 执行下列操作之一:
若要保存框架集文件,请选择“文件”>“保存框架页”。 若要将框架集文件另存为新文件,请选择“文件”>“框架集另存为”。
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
5、设置框架集属性 选中框架集,属性设置如图所示:
保存框架和框架集网页。 6、设置超级链接的目标框架 在left.htm中,分别选中文字部分,设定超级链接,在目标中选择
“right”,如图
上一页
下一页
项目9 建立框架网页
环绕每个框架集的边框非常粗;而环绕每个框架的是较细的灰线,并且每个框架 由框架名称标识。
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
要显示“框架”面板,请执行以下操作: 选择“窗口”>“框架”或按shift+F2。 要在“框架”面板中选择一个框架,请执行以下操作: 在“框架”面板中单击框架,框架周围都会显示一个选择轮廓,如图, 当前选择了名称为top的窗口:
设置框架边框和框架内容之间的空白区域。“边界宽度”设置的是框架左侧 和右侧边框与内容之间的空白区域。“边界高度”设置的是上面和下面的边框 与内容之间的空白区域。
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
(三)设置框架集的属性 选中框架集,打开属性面板,框架集面板的设置如下所示:
教学内容 教学目的 教学重点 教学难点 教学过程
保存网页,在浏览器中预览,效果如图:
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
【小结】
框架网页是网页制作知识的重要组成部分。在制作框架网页时要注意步 骤的规范,在保存框架网页时,要注意是保存的哪部分的框架。每次在框架 网页中添加链接时要注意打开窗口对应的目标位置。灵活调整框架及框架集 属性,可以实现!
为当前选中框架中插入的框架网页的路径,在网页未被保存时使用绝对路径形 式,保存之后使用相对路径形式。 4、“滚动” 设定当框架中的内容超出框架范围时是否出现滚动条,可选项包括以下内容。
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程
5、“不能调整大小” 默认情况下,浏览者使用浏览器观看框架网页时可以拖动框架网页的拆分
上一页
下一页
项目9 建立框架网页
教学内容 教学目的 教学重点 教学难点 教学过程