设计文档：使用网页视图-创建表格

《设计文档：使用网页视图-创建表格》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、下载第8章创建表格8.1用表格更好地组织内容就像列表一样，表格在商业和科学领域用得特别普遍。Web页中可以包含文本和图像，打印图表恰好可以做好这方面的工作，你可以用它们来将文本排列为平行的几列或者在图像所在的单元格旁边的单元格设置一个文本说明块。你可以把清单插入到单元格中，甚至可以把一个表格插入到另一个表格中。所有这些为你布置数据和图像提供了极大的灵活性。图8-1在这种预览模式下观看网页，图像是位于表格首行的单元格中偏左的，而项目编号清单则偏右放置。为清楚起见，表格的边框显示出来；它们是可选的图8-2屏幕下半部的两列编号列表是存放在两列表的单元格中的。单元格的内容是超链接表

2、格中还可以包含链接到其他资源去的超链接，这样可以改变资源的尺寸。例如，你可以制作一个包含有多个图像的缩略图的表格，然后把这些缩略图链接到较大比例的图像上。参见“使用缩略图”，看一看如图轻松地为现有的图形创建缩略图。122第二部分设计文档：使用网页视图下载还可以举另外一个例子，可以把元素周期表中每个元素的项目链接到一个资源，由该资源来为那种元素提供详细的信息。你还可以在表格的单元格中插入表单或FrontPage组件，此时的表格将变成一种交互性的工具。你可以在图8-2中看到这一点。在该图中的两列表格中的单元格中，实际包含有项目编号形式的超链接(在该例中，单元格和表格的边框都没有

3、显示出来)。提示为了更好地理解表格在FrontPage中是如何工作的，你可以将一个Web页存入一个文件中，然后把该文件导入到FrontPage站点上，然后修改表格的属性，看一看会发生什么。从Netscape2.0和Explorer2.0之后的主流浏览器都支持表格。不过，不同浏览器对待单元格边框的视觉效果并不相同，所以在你确定设计方案之前应该看一看边框在各个浏览器中的表现形式。同样重要的是要记住许多人是以640×480的分辨率来浏览站点的；如果你所创建的表格利用了1024×768显示分辨率，那么使用低分辨率的访问者可能将看不到你所预想的效果。8.2建立表格FrontPage提

4、供了许多表格外观选项，但不要直接就开始动手制作一个复杂的表格。而应该首先计划一下，例如在纸上大致地将它绘制出来，把数据和数据表现形式组织好。将给自己节省大量的时间并减少修改的工作量。当完成了表格的内容和结构之后，可按以下步骤进行：1)在网页视图中打开目标网页。当你选中“表格”，“绘制表格”时，表格工具栏将会出现。当将鼠标指针移动到网页视图的工作区上时，鼠标指针将变为表格绘制工具的形状。2)以斜对角的方式在工作区上拖动表格绘制工具，直到你觉得那个矩形的大小和想要的表格的大小差不多了为止。松开鼠标按钮，表格的边框将以默认的1个像素的厚度显示出来。3)在单元格中拖动绘制工具，创建

5、出新的单元格，列或行。当拖动绘制工具时，将会在该位置出现点线，显示出新的单元格边框将要出现的位置。4)将绘制工具放在任何一个单元格边界上面，鼠标指针会变成一个双向箭头。拖动这个箭头可以调整单元格或表格的尺寸(见图8-3)。5)如果进行了误操作，你可以从选择表格工具栏中选择擦除工具。按下鼠标左键，拖动橡皮擦擦过你想要擦除的单元格边框。边框在被选中时将会呈现高亮显示。松开鼠图8-3拖动绘制工具时，将看到一条引导线，标按钮，则该单元格边框就消失了(在某些它显示出单元格边界将来将要出现的位置单元格配置下，特定的一些边框是不能被擦除的)。提示如果你在需要时看不到表格工具栏，请选择“视

6、图”，“工具栏”，“表格”，把它显示出来。如果你不想使用绘制工具，可以使用“表格”，“插入”，“表格”的命令来创建表格。当你想向一个现成的表格中插入表格时，也必须使用这个命令；不能用绘制工具来把表格插入到表格中去。当使用这个命令时，将会看到“插入表格”对话框(见图8-4)。可以在这里设置表格的基本特征。1)在“行数”和“列数”文本框中输入行数和列数。第8章创建表格123下载2)在“对齐方式”下拉列表框中指定所希望表格是居左、居中、还是居右对齐。3)在“边框尺寸”文本框中指定单元格和表格边框的宽度为多少个像素。4)在“单元格填充”文本框中指定单元格内容与单元格内边界之间的间距

7、为多少个像素宽。5)在“单元格间距”文本框中指定单元格图8-4“插入表格”对话框是另一种之间的间距为多少个像素宽。创建表格的方式6)在“指定宽度”文本框中指定所希望的表格宽度，既可以用像素来指定，也可以用浏览器窗口的百分比来指定。7)全都完成以后选择“确定”，表格就出现了。如果选择的“边框尺寸”是0，那么在“普通”模式下，工作区中的单元格轮廓将会用虚线表示出来。这些用虚线表示出来的单元格边框在浏览器或“预览”模式中是看不到的。为单元格填充内容，请单击单元格。如果要填充文本，直接开始输入文字就可以了。文字将在碰到单元