学习目标

3.1

3 3 页面布局设计页面布局设计

学习目标学习目标

能够插入表格，会使用属性面板和菜单对表格进行设定和编辑能够插入表格，会使用属性面板和菜单对表格进行设定和编辑能够运用表格及表格的嵌套和叠加进行网页布局能够运用表格及表格的嵌套和叠加进行网页布局能够运用布局表格进行不规则网页布局能够运用布局表格进行不规则网页布局

3.2


3.13.1 　表格的建立和编辑　表格的建立和编辑

3.23.2 　表格在页面布局中的应用　表格在页面布局中的应用

3.33.3 　布局表格的设置与应用　布局表格的设置与应用

本章内容本章内容

3.3


3.1 　表格的建立和编辑

3.1.1 3.1.1 案例制作：案例制作： 20062006 世界杯世界杯 EE 组对阵表组对阵表

通过本案例的操作，你将学会：如何建立表格和插入表格内容、如何选中表格、行、通过本案例的操作，你将学会：如何建立表格和插入表格内容、如何选中表格、行、单元格和设定单元格的高、宽、对齐方式、如何设置表格和单元格的背景颜色、如何制单元格和设定单元格的高、宽、对齐方式、如何设置表格和单元格的背景颜色、如何制作细线表格。作细线表格。

3.4



33.1.2 .1.2 新知解析新知解析

1.1. 创建表格创建表格创建表格可以通过“插入”面板或菜单两种方创建表格可以通过“插入”面板或菜单两种方法实现。步骤如下：法实现。步骤如下：

将光标移到要插入表格的位置将光标移到要插入表格的位置。。打开“插入”面板，切换到“常用”选项下，打开“插入”面板，切换到“常用”选项下，单击单击表格按钮，或单击菜单“插入”→“表格”命令，表格按钮，或单击菜单“插入”→“表格”命令，

弹出“表格”对话框，如右图所示，可根据需要弹出“表格”对话框，如右图所示，可根据需要进行相应的参数设置。进行相应的参数设置。单击“确定”按钮。单击“确定”按钮。

3.5


需要注意的是下面的设置项目：需要注意的是下面的设置项目：

“ “ 表格宽度”的单位可以是百分比或像素。如果是百分比，则可分表格宽度”的单位可以是百分比或像素。如果是百分比，则可分为两种情况：如果不是嵌套表格，那么百分比是相对于浏览器窗口为两种情况：如果不是嵌套表格，那么百分比是相对于浏览器窗口而言；如果是嵌套表格，则百分比相对的是嵌套表格所在的单元格而言；如果是嵌套表格，则百分比相对的是嵌套表格所在的单元格宽度。宽度。 “ “ 边框粗细”设定表格边框的宽度，单位为像素。边框粗细”设定表格边框的宽度，单位为像素。 “ “ 单元格边距”为表格内容和边框之间的空白区域，单位为像素。单元格边距”为表格内容和边框之间的空白区域，单位为像素。 “ “ 单元格间距”为单元格之间的距离，单位为像素。单元格间距”为单元格之间的距离，单位为像素。


3.6


2. 2. 选取表格元素选取表格元素（（ 11 ）选取整个表格将鼠标指针移动到表格的边框线上单击鼠标左键选择整个表）选取整个表格将鼠标指针移动到表格的边框线上单击鼠标左键选择整个表格。或光标放在表格中时，点击菜单“修改”→“表格”→“选择表格”命令。也可格。或光标放在表格中时，点击菜单“修改”→“表格”→“选择表格”命令。也可以将光标放在单元格中，在文档窗口的左下角的标签选择器中选择“以将光标放在单元格中，在文档窗口的左下角的标签选择器中选择“ Table”Table” 标签，选标签，选取整个表格。取整个表格。（（ 22 ）选取单元格将鼠标指针移动到某个单元格上，按住）选取单元格将鼠标指针移动到某个单元格上，按住 CtrlCtrl 键不放，再单击，键不放，再单击，就可以选中这个单元格。按住就可以选中这个单元格。按住 CtrlCtrl 键，再逐个单击要选取的单元格，就可以选中不连键，再逐个单击要选取的单元格，就可以选中不连续的多个单元格。光标移到某个单元格中，按住续的多个单元格。光标移到某个单元格中，按住 ShiftShift 键鼠标点击另外一个单元格，键鼠标点击另外一个单元格，则这两个单元格之间的所有单元格将被选中，形成一个连续矩形区域。也可以通过鼠则这两个单元格之间的所有单元格将被选中，形成一个连续矩形区域。也可以通过鼠标拖拽的方法可以选取连续的一片单元格。标拖拽的方法可以选取连续的一片单元格。（（ 33 ）选取行或列从一个单元格开始，拖动鼠标选中整行和整列的单元格，单元）选取行或列从一个单元格开始，拖动鼠标选中整行和整列的单元格，单元格所在的行或列即被选中。或将鼠标停留在一行的左边框或一列的上边框，当选择行格所在的行或列即被选中。或将鼠标停留在一行的左边框或一列的上边框，当选择行或列的图标出现时，单击鼠标即可选择行或列。或列的图标出现时，单击鼠标即可选择行或列。


3.7



3. 3. 设定表格和单元格属性设定表格和单元格属性（（ 11 ）表格属性）表格属性当选中整个表格时，属性面板会自动变成表格的设置面板。可以通过这个面板修当选中整个表格时，属性面板会自动变成表格的设置面板。可以通过这个面板修改表格的行数、列数、大小等属性。表格的属性面板如下图所示。其中行、列、宽、改表格的行数、列数、大小等属性。表格的属性面板如下图所示。其中行、列、宽、高、填充（即单元格边距）、间距、边框在创建表格时已经介绍过。高、填充（即单元格边距）、间距、边框在创建表格时已经介绍过。

3.8



（（ 22 ）行列和单元格属性的设定）行列和单元格属性的设定这里将行、列和单元格的属性放在一起，主要是因为它们的属性面板的设置项目这里将行、列和单元格的属性放在一起，主要是因为它们的属性面板的设置项目完全一样，差别只是应用属性的范围不同而已。选择行、列或单元格后属性面板如下完全一样，差别只是应用属性的范围不同而已。选择行、列或单元格后属性面板如下图所示。面板分上下两部分，上面是选中区域内文字属性设定项目，下面是选中的行图所示。面板分上下两部分，上面是选中区域内文字属性设定项目，下面是选中的行、列或单元格属性的设定。、列或单元格属性的设定。

3.9



4. 4. 编辑表格和单元格编辑表格和单元格

（（ 11 ）调整表格大小）调整表格大小选中表格后，利用属性面板设定表格的宽和高来改变大小。或选中表格后，表格选中表格后，利用属性面板设定表格的宽和高来改变大小。或选中表格后，表格上会出现上会出现 33 个控制点。将鼠标置于控制点上，当出现调整图标时，按下鼠标左键拖拽个控制点。将鼠标置于控制点上，当出现调整图标时，按下鼠标左键拖拽边框到想要的位置。边框到想要的位置。

（（ 22 ）更改列宽和行高）更改列宽和行高选定相应的行或列，通过属性面板设定行高或列宽值，从而改变行高列宽。也可选定相应的行或列，通过属性面板设定行高或列宽值，从而改变行高列宽。也可以用鼠标拖动列、行的边框来更改列宽或行高。以用鼠标拖动列、行的边框来更改列宽或行高。

（（ 33 ）添加行和列）添加行和列将光标置于表格中的适当位置，单击菜单“修改”→“表格”→“插入行”命令将光标置于表格中的适当位置，单击菜单“修改”→“表格”→“插入行”命令，则在当前行的上方插入一行。或单击菜单“修改”→“表格”→“插入列”命令，，则在当前行的上方插入一行。或单击菜单“修改”→“表格”→“插入列”命令，则在当前列的左侧插入一列。则在当前列的左侧插入一列。

3.10



（（ 44 ）删除行和列）删除行和列将光标置于要删除的行或列中的任意一个单元格，单击菜单“修改”→“表格”→“ 将光标置于要删除的行或列中的任意一个单元格，单击菜单“修改”→“表格”→“删除行”或“删除列”命令，则删除当前行或列。或者右键单击，在弹出的菜单中选择“删除行”或“删除列”命令，则删除当前行或列。或者右键单击，在弹出的菜单中选择“表格”→“删除行”或“删除列”命令，则删除当前行或列。表格”→“删除行”或“删除列”命令，则删除当前行或列。

（（ 55 ）拆分与合并单元格）拆分与合并单元格拆分只能在一个单元格中进行，合并单元格应在多于一个单元格中进行。拆分只能在一个单元格中进行，合并单元格应在多于一个单元格中进行。合并单元格的步骤：选中要合并的几个单元格，单击属性面板的合并按钮进行合并，合并单元格的步骤：选中要合并的几个单元格，单击属性面板的合并按钮进行合并，或单击菜单“修改”→“表格”→“合并单元格”命令进行相应操作。或单击菜单“修改”→“表格”→“合并单元格”命令进行相应操作。拆分单元格的步骤：选中要拆分的单元格，单击属性面板的拆分按钮，或单击菜单“ 拆分单元格的步骤：选中要拆分的单元格，单击属性面板的拆分按钮，或单击菜单“修改”→“表格”→“合并单元格”命令，会弹出“拆分单元格”对话框，如图所示。设修改”→“表格”→“合并单元格”命令，会弹出“拆分单元格”对话框，如图所示。设定拆分方式和数值，单击“确定”按钮。定拆分方式和数值，单击“确定”按钮。

3.11



（（ 66 ）表格的复制与粘贴）表格的复制与粘贴表格的复制方法：选择要复制的若干单元格，单元格必须是连续的，形状必须为矩表格的复制方法：选择要复制的若干单元格，单元格必须是连续的，形状必须为矩形，点击菜单“编辑”→“复制”或者右击，在弹出的菜单中选择“复制”。形，点击菜单“编辑”→“复制”或者右击，在弹出的菜单中选择“复制”。表格的粘贴方法选择粘贴单元格的位置，点击菜单“编辑”→“粘贴”或者右击，表格的粘贴方法选择粘贴单元格的位置，点击菜单“编辑”→“粘贴”或者右击，在弹出的菜单中选择“粘贴”，会根据选择区域的不同粘贴单元格。在弹出的菜单中选择“粘贴”，会根据选择区域的不同粘贴单元格。

3.12



（（ 77 ）表格的配色方案）表格的配色方案通过表格和单元格的属性设置，我们通过表格和单元格的属性设置，我们可以对表格进行美化。在可以对表格进行美化。在 DreamweaverDreamweaver

中，系统已经内置了一些表格的配色样式中，系统已经内置了一些表格的配色样式，通过格式化表格命令我们可直接套用样，通过格式化表格命令我们可直接套用样式就能制作出漂亮的数据表格。式就能制作出漂亮的数据表格。格式化表格的操作步骤：首先插入表格式化表格的操作步骤：首先插入表格，在对应的单元格中输入数据，点击菜格，在对应的单元格中输入数据，点击菜单“命令”→“格式化表格”，弹出“格单“命令”→“格式化表格”，弹出“格式化表格”对话框，在左侧的列表中选择式化表格”对话框，在左侧的列表中选择一个样式，右侧会显示预览效果。对话框一个样式，右侧会显示预览效果。对话框的下部允许对表格的配色方案和文字、对的下部允许对表格的配色方案和文字、对齐等进行设置。然后点击“确定”按钮。齐等进行设置。然后点击“确定”按钮。

3.13



3.1.3 3.1.3 技巧提示技巧提示

1.1. 填充和间距填充和间距

2. 2. 细线表格和细线的制作细线表格和细线的制作

3.14



3.1.4 3.1.4 实战演练：网站“行星大观”页眉导航部分制作实战演练：网站“行星大观”页眉导航部分制作

通过本案例的操作，你将学会：如何建立表格和插入表格内容、如何选中表格、行、单通过本案例的操作，你将学会：如何建立表格和插入表格内容、如何选中表格、行、单元格和设定单元格的高、宽、对齐方式、如何设置表格的背景图像、如何设置元格和设定单元格的高、宽、对齐方式、如何设置表格的背景图像、如何设置 FlashFlash 背景透背景透明。明。

3.15


3.2 　表格在页面布局中的应用

3.2.1 3.2.1 案例制作：网站“球星风采”主页案例制作：网站“球星风采”主页

通过本案例的操作，你将学会：如通过本案例的操作，你将学会：如何建立表格和设置表格的背景图像、如何建立表格和设置表格的背景图像、如何选中表格、行、单元格和设定其尺寸、何选中表格、行、单元格和设定其尺寸、对齐方式、如何设定表格的嵌套和叠加、对齐方式、如何设定表格的嵌套和叠加、如何利用如何利用 marqueemarquee语句制作跑马灯效果、语句制作跑马灯效果、如何利用表格单元格制作细线。如何利用表格单元格制作细线。

3.16



33..22.2 .2 新知解析新知解析

1.1. 表格的嵌套表格的嵌套要设计一个版式精美的网站，需要应用表格的嵌套。原因要设计一个版式精美的网站，需要应用表格的嵌套。原因有以下两个方面：有以下两个方面：首先，网页的排版有时会很复杂，在外部需要有一个表格首先，网页的排版有时会很复杂，在外部需要有一个表格控制总体布局。如果这时一些内部排版的细节也通过总表格来控制总体布局。如果这时一些内部排版的细节也通过总表格来实现，容易引起行高列宽等的冲突，给表格制作带来困难。实现，容易引起行高列宽等的冲突，给表格制作带来困难。其次，浏览器在解析网页的时候，是将整个表格的结构下其次，浏览器在解析网页的时候，是将整个表格的结构下载完毕之后才显示表格。如果不使用嵌套，表格非常复杂，浏载完毕之后才显示表格。如果不使用嵌套，表格非常复杂，浏览者要等待很长时间才能看到网页内容。览者要等待很长时间才能看到网页内容。因此在版面设计中引入表格嵌套，由总表格负责整体的排因此在版面设计中引入表格嵌套，由总表格负责整体的排版，由嵌套的表格负责各个子栏目的排版，并插入到总表格的版，由嵌套的表格负责各个子栏目的排版，并插入到总表格的相应位置。左图所示为表格嵌套的一个例子。相应位置。左图所示为表格嵌套的一个例子。创建嵌套表格的操作方法是：将光标置于要插入嵌套表格创建嵌套表格的操作方法是：将光标置于要插入嵌套表格的单元格中，选择菜单“插入”→ “表格”命令。的单元格中，选择菜单“插入”→ “表格”命令。

3.17


2.2. 表格的叠加表格的叠加当使用表格进行排版定位时，整个网页的结构都应用表格，而不能仅局部使用表格。当使用表格进行排版定位时，整个网页的结构都应用表格，而不能仅局部使用表格。由于浏览器解析网页时，是将整个表格的结构下载完毕之后才显示表格。表格过大、过由于浏览器解析网页时，是将整个表格的结构下载完毕之后才显示表格。表格过大、过于复杂，影响浏览下载速度。我们可以将复杂的表格拆分成上下叠加各自独立的表格，于复杂，影响浏览下载速度。我们可以将复杂的表格拆分成上下叠加各自独立的表格，每个表格中再嵌套表格。这样在布局网页时既减轻难度，增加了灵活性，又加快了浏览每个表格中再嵌套表格。这样在布局网页时既减轻难度，增加了灵活性，又加快了浏览下载速度。下图所示的网页结构就是采用表格的嵌套和叠加技术实现的。下载速度。下图所示的网页结构就是采用表格的嵌套和叠加技术实现的。


3.18


3.3. 利用利用 <marquee></marquee><marquee></marquee> 标记符设置跑马灯效果标记符设置跑马灯效果基本语法：基本语法：<marquee><marquee> 文字或图片文字或图片 </marquee></marquee>

该语法只适用于该语法只适用于 IEIE 浏览器中显示，只能在浏览器中显示，只能在 <body><body> 标记中使用。作用标记中使用。作用是实现标记中的内容在页面中移动的效果。是实现标记中的内容在页面中移动的效果。


3.19




1.1. 嵌套注意事项嵌套注意事项

22. . 鼠标对跑马灯特效的影响鼠标对跑马灯特效的影响

3.20



3.2.4 3.2.4 实战演练：网站“球星风采”子页的制作实战演练：网站“球星风采”子页的制作

通过本案例的操作，你将学会：如何建通过本案例的操作，你将学会：如何建立表格和设置表格的背景图像、如何选中表立表格和设置表格的背景图像、如何选中表格、行、单元格和设定其尺寸、对齐方式、格、行、单元格和设定其尺寸、对齐方式、如何设定表格的嵌套和叠加、如何利用如何设定表格的嵌套和叠加、如何利用 marmar

queequee语句制作跑马灯效果、如何利用表格单语句制作跑马灯效果、如何利用表格单元格制作细线。元格制作细线。

3.21


3.3 　布局表格的设置与应用

3.3.1 3.3.1 案例制作：网站“闪闪作坊”页眉部分案例制作：网站“闪闪作坊”页眉部分

通过本案例的操作，你将学会：如何绘制布局表格、嵌套布局表格、布局单元格和通过本案例的操作，你将学会：如何绘制布局表格、嵌套布局表格、布局单元格和移动布局表格、布局单元格、如何选中布局表格、布局单元格和设定其尺寸、对齐方式、移动布局表格、布局单元格、如何选中布局表格、布局单元格和设定其尺寸、对齐方式、如何插入鼠标经过图像。如何插入鼠标经过图像。

3.22



33..33.2 .2 新知解析新知解析

1. 1. 表格视图模式表格视图模式 Dreamweaver 8Dreamweaver 8 为表格提供了标准视图、扩展视图、布局视图三种视图模式。默为表格提供了标准视图、扩展视图、布局视图三种视图模式。默认情况下是标准视图，即传统的表格使用方式。认情况下是标准视图，即传统的表格使用方式。

2. 2. 切换布局视图切换布局视图在“插入”面板的“布局”选项卡中单击“布局”按钮，进入布局视图模式。在“插入”面板的“布局”选项卡中单击“布局”按钮，进入布局视图模式。

3.23


3. 3. 绘制布局表格和布局单元格绘制布局表格和布局单元格在“插入”面板的“布局”选项卡中单击“布局”按钮，进入布局视图模式。绘制在“插入”面板的“布局”选项卡中单击“布局”按钮，进入布局视图模式。绘制布局表格时，单击“插入”面板上的布局表格按钮；绘制布局单元格时，单击“插入”布局表格时，单击“插入”面板上的布局表格按钮；绘制布局单元格时，单击“插入”面板上的绘制布局单元格按钮，光标变为十字形状。将鼠标放置在要绘制表格的区域，面板上的绘制布局单元格按钮，光标变为十字形状。将鼠标放置在要绘制表格的区域，拖动鼠标绘制出所需的布局表格和布局单元格。布局表格的外框为绿色，左上角显示标拖动鼠标绘制出所需的布局表格和布局单元格。布局表格的外框为绿色，左上角显示标签名称“布局表格”，其尺寸在表格下部显示。布局单元格的外框为蓝色。签名称“布局表格”，其尺寸在表格下部显示。布局单元格的外框为蓝色。


3.24


4. 4. 绘制嵌套表格绘制嵌套表格创建嵌套表格的绘制顺序为先绘制外部的表格，再绘制内部的嵌套表格。创创建嵌套表格的绘制顺序为先绘制外部的表格，再绘制内部的嵌套表格。创建嵌套表格的步骤是：建嵌套表格的步骤是：在布局视图中，单击“布局表格”按钮，在页面中绘制出布局表格。再单击在布局视图中，单击“布局表格”按钮，在页面中绘制出布局表格。再单击“布局表格”按钮，在已有的表格中绘制表格，形成嵌套表格。“布局表格”按钮，在已有的表格中绘制表格，形成嵌套表格。

5. 5. 在单元格中添加内容在单元格中添加内容在布局单元格中可以插入任何类型的数据。在插入时，把光标移到要插入内在布局单元格中可以插入任何类型的数据。在插入时，把光标移到要插入内容的单元格中，然后输入数据。在输入数据时，布局单元格的宽度会随着输入数容的单元格中，然后输入数据。在输入数据时，布局单元格的宽度会随着输入数据的长度而变化。在输入数据时，只能向布局单元格中输入数据，而不能向布局据的长度而变化。在输入数据时，只能向布局单元格中输入数据，而不能向布局表格中输入数据。表格中输入数据。


3.25



（（ 11 ）表格的复制与粘贴）表格的复制与粘贴表格的复制方法：选择要复制的若干单元格，单元格必须是连续的，形状必须为矩表格的复制方法：选择要复制的若干单元格，单元格必须是连续的，形状必须为矩形，点击菜单“编辑”→“复制”或者右击，在弹出的菜单中选择“复制”。形，点击菜单“编辑”→“复制”或者右击，在弹出的菜单中选择“复制”。表格的粘贴方法选择粘贴单元格的位置，点击菜单“编辑”→“粘贴”或者右击，表格的粘贴方法选择粘贴单元格的位置，点击菜单“编辑”→“粘贴”或者右击，在弹出的菜单中选择“粘贴”，会根据选择区域的不同粘贴单元格。在弹出的菜单中选择“粘贴”，会根据选择区域的不同粘贴单元格。

（（ 22 ）表格的配色方案）表格的配色方案通过表格和单元格的属性设置，我们可以对表格进行美化。在通过表格和单元格的属性设置，我们可以对表格进行美化。在 DreamweaverDreamweaver 中，系中，系统已经内置了一些表格的配色样式，通过格式化表格命令我们可直接套用样式就能制作统已经内置了一些表格的配色样式，通过格式化表格命令我们可直接套用样式就能制作出漂亮的数据表格。出漂亮的数据表格。格式化表格的操作步骤：首先插入表格，在对应的单元格中输入数据，点击菜单“ 格式化表格的操作步骤：首先插入表格，在对应的单元格中输入数据，点击菜单“命令”→“格式化表格”，弹出“格式化表格”对话框，在左侧的列表中选择一个样式命令”→“格式化表格”，弹出“格式化表格”对话框，在左侧的列表中选择一个样式，右侧会显示预览效果。对话框的下部允许对表格的配色方案和文字、对齐等进行设置，右侧会显示预览效果。对话框的下部允许对表格的配色方案和文字、对齐等进行设置。然后点击“确定”按钮。。然后点击“确定”按钮。

3.26


6. 6. 选择布局表格、布局单元格选择布局表格、布局单元格选择布局单元格的方法：用鼠标单击单元格外框，当单元格外框出现选择布局单元格的方法：用鼠标单击单元格外框，当单元格外框出现 88 个控制点时即个控制点时即

被选中。或按住被选中。或按住 CtrlCtrl 键后在单元格的任意位置单击鼠标，也可选中单元格键后在单元格的任意位置单击鼠标，也可选中单元格。。选择布局表格的方法：用鼠标单击表格标签，当表格外框出现控制点时即被选中。选择布局表格的方法：用鼠标单击表格标签，当表格外框出现控制点时即被选中。

7. 7. 调整布局表格、布局单元格大小调整布局表格、布局单元格大小

首先选中要改变大小的表格或单元格，用鼠标拖动控制点即可改变大小首先选中要改变大小的表格或单元格，用鼠标拖动控制点即可改变大小。。

8. 8. 移动布局表格、布局单元格移动布局表格、布局单元格用户可以随意移动位于布局表格中的布局单元格和嵌入的布局表格。首先选中要移动用户可以随意移动位于布局表格中的布局单元格和嵌入的布局表格。首先选中要移动的对象，将鼠标移到对象边缘，出现指针图标后，按下鼠标将其拖拽到新的位置即可。也的对象，将鼠标移到对象边缘，出现指针图标后，按下鼠标将其拖拽到新的位置即可。也可以使用方向键移动，每按一次方向键，移动可以使用方向键移动，每按一次方向键，移动 11 个像素的距离；如果按住个像素的距离；如果按住 ShiftShift 键，每按键，每按

一次方向键，移动一次方向键，移动 1010 个像素的距离个像素的距离。。


3.27


9. 9. 清除单元格高度清除单元格高度当在单元格中插入内容后，如果单元格的大小与所插入的内容不太匹配时，可以通当在单元格中插入内容后，如果单元格的大小与所插入的内容不太匹配时，可以通过清除行高命令让单元格的高度匹配插入的内容。过清除行高命令让单元格的高度匹配插入的内容。清除单元格高度的步骤为：选中单元格所在的表格，点击属性面板中的清除行高按钮；清除单元格高度的步骤为：选中单元格所在的表格，点击属性面板中的清除行高按钮；或点击表格上端的列标题上的按钮，打开列标题菜单，选择“清除所有高度”命令，如或点击表格上端的列标题上的按钮，打开列标题菜单，选择“清除所有高度”命令，如图所示，单元格的高度会随着单元格内容而变化。图所示，单元格的高度会随着单元格内容而变化。


3.28


10.10. 设置布局表格和布局单元格属性设置布局表格和布局单元格属性 ( 1( 1 ）设置布局表格属性）设置布局表格属性 “ “固定”：将表格设置为固定宽度固定”：将表格设置为固定宽度 “ “ 自动伸展”：将表格设置为自动伸展自动伸展”：将表格设置为自动伸展 “ “ 高”：输入以像素为单位的数值，设置布局表格的高度高”：输入以像素为单位的数值，设置布局表格的高度 “ “ 填充”：设置表格中单元格内容与边界之间的距离填充”：设置表格中单元格内容与边界之间的距离 “ “ 间距”：设置表格中单元格之间的距离间距”：设置表格中单元格之间的距离清除行高按钮：清除布局表格中单元格的显示高度清除行高按钮：清除布局表格中单元格的显示高度使单元格宽度一致按钮：使使单元格宽度一致按钮：使 HTMLHTML 代码中的单元格的固定列宽和窗口中的宽度相匹代码中的单元格的固定列宽和窗口中的宽度相匹配配删除所有间隔图像按钮：删除所有的间隔图像删除所有间隔图像按钮：删除所有的间隔图像删除嵌套按钮：删除嵌套表格，保留嵌套表格中的内容删除嵌套按钮：删除嵌套表格，保留嵌套表格中的内容


3.29


（（ 22 ）设置布局单元格属性）设置布局单元格属性 “ “固定”：将单元格设置为固定宽度固定”：将单元格设置为固定宽度 “ “ 自动伸展”：将单元格设置为自动伸展自动伸展”：将单元格设置为自动伸展 “ “ 高”：输入以像素为单位的数值，设置布局单元格的高度高”：输入以像素为单位的数值，设置布局单元格的高度 “ “ 背景颜色”：设置单元格背景颜色，单击按钮选取颜色，或输入颜色的十六进制背景颜色”：设置单元格背景颜色，单击按钮选取颜色，或输入颜色的十六进制代代码码 “ “水平”：设置单元格中的内容的对齐方式为水平对齐方式水平”：设置单元格中的内容的对齐方式为水平对齐方式 “ “垂直”：设置单元格中的内容的对齐方式为垂直对齐方式垂直”：设置单元格中的内容的对齐方式为垂直对齐方式 “ “ 不换行”：选择该项时，输入较多内容时，单元格会自动伸展，防止换行不换行”：选择该项时，输入较多内容时，单元格会自动伸展，防止换行


3.30


11. 11. 设置布局表格和布局单元格的背景图像设置布局表格和布局单元格的背景图像在布局视图下，不能直接为布局表格和布局单元格设置背景图像。当需要设置背景在布局视图下，不能直接为布局表格和布局单元格设置背景图像。当需要设置背景图像时，需要先选中布局表格或布局单元格，切换到标准视图下，再在属性面板中设定图像时，需要先选中布局表格或布局单元格，切换到标准视图下，再在属性面板中设定背景图像。背景图像。


3.31




1. 1. 吸附现象吸附现象

2. 2. 布局模式与标准模式的配合布局模式与标准模式的配合

3.32



3.3.4 3.3.4 实战演练：网站“行星大观”主页的制作实战演练：网站“行星大观”主页的制作

通过本案例的操作，你将学会：通过本案例的操作，你将学会：如何绘制布局表格、布局单元格和移动如何绘制布局表格、布局单元格和移动布局表格、布局单元格、如何选中布局布局表格、布局单元格、如何选中布局表格、布局单元格和设定其尺寸、背景表格、布局单元格和设定其尺寸、背景图像、水平和垂直的对齐方式、如何设图像、水平和垂直的对齐方式、如何设置置 FlashFlash 背景透明和制作跑马灯效果。背景透明和制作跑马灯效果。

学习目标

Documents