Dreamweaver网页设计 第6章表格的应用
Dreamweaver 网页设计 第6章 表格的应用
【学习概述】 表格是控制网页页面布局最有力的工具。 使用表格可以对列表数据进行布局,布局 网页文本、图像、媒体等。 Dreamweaver 提供了3种方式来查看和操作表格:标准视 图、扩展视图、布局视图。本章重点是: 表格的基本操作和布局视图下表格的操作
【学习概述】 表格是控制网页页面布局最有力的工具。 使用表格可以对列表数据进行布局，布局 网页文本、图像、媒体等。Dreamweaver 提供了3种方式来查看和操作表格：标准视 图、扩展视图、布局视图。本章重点是： 表格的基本操作和布局视图下表格的操作
6.1【课堂讲解】表格基础 61.1表格和单元格 1.表格 表锅里其在格击显爹若数以行交香和冬(个同组 表格由三个基本部件组成:行、列、单元格。具有宽度、高度、间距、 边框等属性 2.单元格 表格由一个或多个单元格构成,单元格是指表格内的每个小格子。 61.2表格结构 如图6-1所示的表格。 其各参数值如下: 行:2。 单元格 列:3 单元格数目:6。 宽度:400。 表格宽度 高度:200 间距:10 图61表格结构 边框:5
6.1 【课堂讲解】表格基础 6.1.1 表格和单元格 1. 表格 表格是用于在网页上显示表格式数据以及对文本和图形进行布局的强有 力的工具。表格由一行或多行组成；每行又由一个或多个单元格组成。 表格由三个基本部件组成：行、列、单元格。具有宽度、高度、间距、 边框等属性。 2. 单元格 表格由一个或多个单元格构成，单元格是指表格内的每个小格子。 6.1.2 表格结构 如图6-1所示的表格。 其各参数值如下： 行：2。 列：3。 单元格数目：6。 宽度：400。 高度：200。 间距：10。 边框：5。 图 6-1 表格结构
62.1插入表格 插入表格步骤如下 (1)新建文档“ bg. htm",执行【插入】->【表格】命令或在“插入” 栏的的“常用”类别中,单击“表格”按钮,如图6-3所示。显示 “表格”对话框,如图6-4所示。 插入「常用布局|表单文本ⅢML|应用程序|Fash元素|收藏夹 回晶国国易,,崮,回 行数:1:2 表格宽度:700像素 图6-3“表格”按钮 边框相细:1像索 单元格边距: 单元格间距 甲目= 对齐标题:默认N 帮助 确定匚取消 图6-4“表格”对话框
6.2.1 插入表格 插入表格步骤如下： （1）新建文档“bg.html”，执行【插入】->【表格】命令或在“插入” 栏的的“常用”类别中，单击“表格”按钮，如图6-3所示。显示 “表格”对话框，如图6-4所示。 图 6-3 “表格”按钮 图 6-4 “表格”对话框
2)设置“表格”对话框选项如下: 行数:表格的行数目,本例为“1”。 列数:表格的列数目,本例为“2”。 表格宽度:以像素为单位或按以窗口宽度的百分比来指定表格的宽度, 本例为“700象素。 边框粗细:表格边框的宽度。 单元格边距:单元格边框和单元格内容之间的像素数 单元格间距:相邻的表格单元格之间的像素数。 “页眉”选项组中一共4个标题选项:无、左侧、顶部、两者。 无:对表格不启用列或行标题。 左侧:将表格的第一列作为标题列,以便为表格中的每一行输入一个标 顶部:将表格的第一行作为标题行,以便为表格中的每一列输入一个标 两者:在表格中输入列标题和行标题。 标题:显示在表格外的表格标题 对齐标题:表格标题相对于表格的位置。 摘要:表格的说明信息。 设置完毕后,单击“确定”按钮,完成创建表格操作。效果如图6-5所示:
（2）设置“表格”对话框选项如下： 行数：表格的行数目，本例为“1”。 列数：表格的列数目，本例为“2”。 表格宽度：以像素为单位或按以窗口宽度的百分比来指定表格的宽度， 本例为“700”象素。 边框粗细：表格边框的宽度。 单元格边距：单元格边框和单元格内容之间的像素数。 单元格间距：相邻的表格单元格之间的像素数。 “页眉”选项组中一共4个标题选项：无、左侧、顶部、两者。 无：对表格不启用列或行标题。 左侧：将表格的第一列作为标题列，以便为表格中的每一行输入一个标 题。 顶部：将表格的第一行作为标题行，以便为表格中的每一列输入一个标 题。 两者：在表格中输入列标题和行标题。 标题：显示在表格外的表格标题。 对齐标题：表格标题相对于表格的位置。 摘要：表格的说明信息。 设置完毕后，单击“确定”按钮，完成创建表格操作。效果如图6-5所示：