第28讲 网页中的表格和框架.doc

第28讲 网页中的表格和框架 在网页中应用表格、可以使内容具有条理性和比较性，应用框架可将网页分割成功能不同的数块。一、 表格处理FrontPage制作网页时，不能象Word那样对图文混排（环绕），一般只能用表格来定位图片和文字。 如果你学习过Word文本中的表格功能或Excel电子表格功能，那么你对网页中表格的应用就会很快掌握。1、 插入表格：插入表格有两种方法：（演示）先打开一网页（如：index.htm），选定插入位置。方法1：单击常用工具栏的“插入表格”按钮，再用鼠标向右下方拖出需要的行数、列数表格即可。 方法2：点击菜单“表格”“插入”“表格”，在打开的“插入表格”对话框中，输入需要的列、行数，按“确定”即可。 2、 单元格中输入内容：表格是由行与列构成的单元格组成，单元格中可输入文字和图片（演示：在插入的表格中输入文字和利用菜单“插入”“图片”，插入剪贴画或图片文件，进行无表格线图、文字环绕和文字的竖排等）。3、 添加行或列：方法：（演示）、在上表格中选定位置。、点击菜单“表格”“插入”“行或列”。、在“插入行或列”对话框中，确定插入行或列及插入位置，点击“确定”按钮。4、 调整行高和列宽：用鼠标可直接拖动表格线来调整行高和列宽（演示）。也可利用菜单中“表格”中有关项来平均行高和列宽（演示）。5、 设置颜色和背景：选中表格，右击出快捷菜单，选择“表格属性”来设置颜色和背景（演示）。6、 表格及内容的对齐方式：在“表格属性”对话框中，可设置整个表格在页面上的对齐方式（演示）。在“单元格属性”对话框中，可设置单元格中的内容在单元格中的对齐方式（演示）。7、 设置单元格的边距和间距：光标定位在网页表格中，打开“表格属性”对话框，可设置单元格的边距和间距。单元格边距：指单元格中内容和单元格边框间距离。单元格间距：指单元格与单元格之间的距离。8、 给表格添加标题：光标定位在网页表格中，点击菜单中：“表格”“插入”“标题”项，则光标自动定位在表格上方，可输入标题文字（演示）。（注：选中表格标题，右击，可点取“标题属性”来作进一步设置）。9、 对单元格进行修饰： 选定几个单元格，右击弹出快捷菜单，从中可对单元格进行删除、拆分、合并。 并可通过“单元格属性”进行单元格的设置（演示）。二、 网页框架设计网页框架将使你浏览窗口分割成不同的区域，此区域称为框架，每一个框架可以显示不同的网页。当你在一框架所显示网页的超链接上单击，此超链接所指定网页可在其它框架中显示。框架网页通常用于目录、文章列表或其它种类的网页上，单击一个框架内的（如下图左框的学校简介超链接，会在右边框架中显示其内容网页。设置初始网页（链接到一个已有网页）新建网页（该区域作为一个新网页）学校简介院士介绍效实中学介绍1959年和1978年两次被列为省重点中学。1980年复称“效实”。 1981年被定为省首批重点中学。1995年宁波效实中学被定为省一级重点中学。 1999年被批准为举办“浙江省创新教育理科实验班”的全省二所试点中学之一。设置初始网页（链接到一个已有网页）新建网页（该区域作为一个新网页） 新建网页内容 图511、 建立框架 点击在菜单中“文件”“新建”“网页”，打开了“网页模板”对话框，从中单击“框架网页”选项卡，选择“标题、页脚和目录”框架模板，点击“确定”按钮，则在视图工作区中出现了一个框架网页（演示）。2、 设置框架中的网页文件 在新的框架网页中，为每个框架设置初始网页（链接到一个已有网页）或新建一个网页。 演示1：设置初始网页（如在上框架网页的顶部和底部建立超链接）；单击框架中的“设置初始网页”按钮，出现“创建超链接”对话框，选择一个所需网页文件，单击“确定”，就建立了超链接；（如果要改变超链接，可右击菜单，在“框架属性”中可改变该链接）演示2：新建网页（如在上框架网页的左部建立新网页）； 单击框架中的新建网页，输入内容（如：“学校简介”、“院士介绍”等）； 如果要单击学校简介超链接，在右边框架中显示其内容网页，这就要： 3、 创建在其它框架内显示网页的超链接在框架网页中，当你单击某框架内网页的超链接时，被超链接所指定的网页通常在另一个框架中打开，该框架称为目标框架。（演示）例如：在图51中，在左边目录框架中点击“学校简介”，则在右边主框架中显示学校介绍内容。 设置方法：（演示） 、在目录框架的“新建网页”中，输入文字“学校简介”，并选中。 、单击工具栏中“超链接”，在“超链接”对话框中，选择文件“学校简介.htm”。、（在“超链接”对话框中），打开了“目标框架”对话框，从中点中主框架或点取“网页默认值”（main）,再依次单击“确定”按钮即可。再次演示：点击“院士介绍”，在右边主框架中显示院士介绍内容。(实际上，我们看到的“学校简介”和“院士介绍”的网页采用的就是框架网页)4、 调整框架大小用鼠标拖动框架分隔线可改变框架大小（演示）。右击，在弹出菜单中，选择“框架属性，在此对话框中，可输入框架高度值，以改变框架大小（演示）。5、 设置框架滚动条在某个框架中，如没有滚动条，可在“框架属性”对话框中，在显示滚动条栏目中，选择“在需要时”后，点击“确定”按钮即可（演示）。6、 设置框架的边框外观（右击）打开“框架属性”对话框，点击“框架网页”按钮。在打开的“框架网页”对话框中，选择“框架”选项卡，可关闭打开“显示边框”功能，也有框架间距大小值设置（演示）。7、 设置框架间距选中框架网页中某一框架，打开“框架属性”对话框，从中可改变框架内容文字边框的距离（即边距：宽度、高度）。（演示）8、 保存框架网页 （演示，如框架中有新建网页，在保存中先保存新建网页，最后保存框架网页