网页中设定表格边框的厚度的属性_网页设计实验报告4

实现步骤

1. 创建框架集

步骤

①创建本地站点名为kj，位置为D：\kj，默认文件夹为img，新建站点对话框的设置如图所示。

②在DW起始页面，单击“新建”类别的“HTML”按钮，新建HTML页面Untitled-1，如图所示。

③单击“插入”菜单栏“HTML-框架”，选择“上方及左侧嵌套”选项，如图所示。该框架集图标中的灰色部分，是当前打开的页面Untitled-1的位置。

④在弹出的框架“标签辅助功能属性”对话框中，为各个框架命名，此处由于是采用系统提供的框架类型，名称都是默认的，直接单击“确定”按钮即可，如图所示。可看到当前编辑窗口被分割成了三块，其中的每一块是一个HTML文档，而整体信息则放在框架集文件中。

⑤选择“文件”-“保存全部”命令，逐个保存创建的各文档。首先保存的是框架集文件，它是整个框架网页的入口，用来存放区域划分、各框架属性等综合信息，故将其命名为index.html，随后依次保存各框架中的网页、每保存一个页面，都会在相应框架上用虚线框标识，如图所示。

⑥也可在各个框架内单击，选择“文件-保存框架”命令，保存各框架文档，分别为top.html、left.html、main.html。

⑦在“窗口”菜单栏中单击“框架”命令，打开“框架”面板，在框架示意图上单击框架，可选中该框架，这是在“属性”面板上可看到该框架的相关属性，DW为预定义的框架设置了名称，如mainFrame、leftFrame、topFrame等，如图所示。

⑧在所创建的框架集中，框架的边框是看不见的，为了便于调整大小，选择“查看-可视化助力-框架边框”命令，使其可见，如图所示。

2.制作各框架中的页面

(1)制作顶部页面(top.html)

步骤

①将光标定位于上面的框架内，插入1*1表格，设置对齐方式为居中对齐，在单元格中插入图片，如图所示。若页面高度不够可拖动框架边框进行调整。

(2)创建左页面(left.html)

步骤

①将光标定位于左边框架内，单击“属性”面板中的“页面属性”按钮，将左边距和上边距设为0px。

②选择“窗口-框架”命令，可打开“框架”面板，在其中单击各框架区域可选择相应的框架，而单击框架的边线，则可选中相应的框架集，如图所示。

③选中框架或框架集后，即可在“属性”面板查看或修改其属性值，如图所示。在“框架”面板中单击左右框架的外框线，选中框架集，在“属性”面板中，设置“列”为200像素。

④插入一个5*2的表格，“表格宽度”为200像素，如图所示。在表格内插入图片和文本，如图所示

(3)制作右侧主页面(main.html)

步骤

①将光标定位于右面的框架内，在页面内插入一个1*1的表格，在属性检查器中将“对齐”设置为居中对齐，“表格宽度”设为宽度的80%，如图所示。

②在表格内输入文档main.txt里的文字，如图所示。在HTML属性检查器中设置文本格式为“段落”。

(4)创建链接子页面

步骤

①新建五个页面，分别为1.html、2.html、3.html、4.html、5.html。

②编辑页面1.html，插入一个1*1的表格，如图所示，将对其方式设置为居中对齐，宽度为80%，将文本插入其中，在html属性检查器中设置文本格式为“段落”。

③编辑页面2.html,将内容插入表格，如图所示。

④编辑页面3.html,将内容插入表格，如图所示。

⑤编辑页面4.html,将内容插入表格，如图所示。

⑥编辑页面5.html,将内容插入表格，如图所示。

3.创建超链接

步骤

①在左边框架中的文本，是用来进行导航链接的。选中文本“HTML入门”，单击“属性”面板“链接”文本框右边的“浏览”按钮，在目录中选择1.html，单击“确定”按钮，在“目标”下拉列表中，选择“mainFrame”,如图所示。

②为其他文本添加链接并设定链接目标，其他文本的链接目标也设定为mainFrame。

4.保存框架集

选择“文件-保存全部”命令，将框架集和框架的内容全部保存，如图所示。

此案例摘自葛艳玲《网页制作基础教程》