Dreamweaver应用与网页设计案例教程 教学课件 作者 杨长安 沈大林 孟昭勇 第4章框架、层与网页布局.pdfVIP

第 4 章 框架、层与网页布局 4.1 框架 框架就是把一个网页页面分成几个单独的区域（即窗口），每个区域就像一个独立的网页，可以是 一个独立的 HTML 文件。框架可以在一个网页内显示多个 HTML 文件。对于一个有 n 个区域的框架网页来 说，每个区域有一个 HTML 文件，整个框架结构也是一个 HTML 文件，因此该框架网页是一个 HTML 文件 集，它有 n+1 个 HTML 文件。 【相关知识】创建框架和框架观察器 1．创建框架 在网页中创建框架的常用方法可以有以下 3 种。 − 106−  （1）单击 “修改”→ “框架集”→ “×××”菜单命令或单击 “插入”→ “HTML”→ “框架”→ “× ××”菜单命令，都可以创建框架。 （2）单击 “文件”→ “新建”菜单命令，调出 “新 建文档”对话框。 选择该对话框左边 “类别”栏中的 “框架集”选项，再 选择 该对话框右 边“框架集”栏内的一种框架选项，然后单击“创建” 按钮，即可创建有 框架的网页。 （3）单击 “插入” （布局）栏内 “框架”快捷菜单 中的一个菜单命 令， 如图 4-1-1 所示， 即可在页面内显示出相应的框架。 2．框架观察器 单击“窗口”→ “框架”菜单命令，调出“框架” 面板，也叫框架观 图4­1­1  “框架”快捷菜单 − 107−  察器。如果光标在框架内，则框架观察器中对应框架内的文字变为黑色，如图 4-1-2 所示。 框架观察器的作用是显示框架网页的框架结构（也叫分栏结构）。单击某一个分栏框架 （选中的框 架边框呈黑色），即可选中该分栏框架，同时 “属性”栏变为该分栏框架的“属性”栏。如果单击框架 的外框线，则可以选中整个框架 （即框架集），如图 4-1-3 所示，同时 “属性”栏变为框架集的 “属性” 栏。 3．增减框架个数 创建框架后，要增加或减少框架的个数，首先应单击框架内部，再单击“查看”→“可视化助理” →“框架边框”菜单命令，使该菜单命令左边有 ，然后可采用如下方法进行。 − 108−  图 4-1-2 “框架”面板 图 4-1-3 选中整个框架后的框架观察器 （1）增加新框架：将鼠标指针移到框架的四周边缘处，当鼠标指针为“n”或 “o”形状时，沿鼠 标指针箭头指示的方向向内拖曳鼠标，即可在水平或垂直方向增加一个框架。 （2）在框架区域内增加新框架：单击某一个框架区域内部，使光标在此区域内出现，然后按照上述 方法即可在框架区域内增加新框架。 − 109−  （3）调整框架的大小：用鼠标拖曳框架线，即可调整框架的大小。 （4）删除框架：用鼠标拖曳框架线，一直拖曳到另一条框架线或边框处，即可删除框架。 【相关知识】在框架内插入 HTML 文件和保存框架文件 1．在框架内插入 HTML 文件 （1）单击网页分栏框架的某一个分栏框架窗口内部，使光标在该分栏框架窗口内出现，在其中输入 文字或导入对象，然后将该分栏框架中的内容保存为网页文件。 （2）按住 Alt 键，单击一个框架分栏内部，使光标出现在该分栏框架窗口内，或者单击 “框架”面 板中的分栏框架内部，选中相应的分栏框架，然后单击其 “属性”栏中的 “源文件”按钮 ，调出 “选 择 HTML 文件”对话框，如图 4-1-4 所示。 − 110−  图 4-1-4 “选择 HTML 文件”对话框 利用该对话框选择文