第九章使用表格布局页面分析.pptVIP

范例效果 使用表格布局页面 课程代码： 课程介绍 目的：通过学习掌握使用表格布局页面。 内容: 页面布局是进行网页设计最基本最重要的工作之一。用于网页布局设计的常用工具是表格。 重点：制作表格的方法,表格数据的处理。 难点：使用表格进行页面布局。 制作表格的方法 表格数据的处理 使用其他模式进行页面布局 在页面中使用表格进行排版 使用表格布局页面 选择表格 添加与删除行或列 合并与拆分单元格 设置表格整体属性 表格的嵌套 表格数据的处理 页面布局是进行网页设计最基本、最重要的工作之一。用于网页布局设计的常用工具是表格。合理布局表格，会使网页更具有自身的特点，也可便于管理和修改。 制作表格的方法 插入表格 表格是整个网页设计的精华，它具有输入数据和进行分类列表的功能，而且当前许多网站都用表格来协助网页的排版。表格为Web页带来了结构的概念。现在，Web页设计者已经把表格当作控制Web页面布局的重要的工具。 Dreamweaver可以在另一个应用程序中创建并以分隔文本的格式（其中的项以制表符、逗号、冒号或分号隔开）保存的表格式数据导入到 Dreamweaver 中并设置为表格格式。 导入外部链接数据文件 表格是用于在HTML页上显示表格式数据以及对文本和图形进行布局的强有力的工具。表格由一行或多行组成；每行又由一个或多个单元格组成。 在网页中，表格用于网页内容的排版，如文字放在页面的哪个位置，可以使用表格来解决这个问题。下面来介绍表格的基本操作。 表格数据的处理 像处理文本或图像一样，首先需要选择表格,然后才是修改编辑。在Dreamweaver中用户可以一次选定全部表格、一行、一列或几个连续的单元格，也可以选定表格中不连续的单元格，然后通过属性面板来修改它们的属性。 选择表格 表格创建后，可能需要添加内容而添加行或列。用户可以使用不同方法在表格中的几乎任何地方添加行或列。 添加与删除行或列 在使用表格的过程中，有时需要拆分单元格以达到最终的效果。拆分单元格就是将选中的单元格拆分为多行或多列。 合并与拆分单元格 在Adobe Dreamweaver CS5中为了使创建的表格更加美观、醒目，需要对表格 属性进行设置。 设置表格整体属性 嵌套表格是指在另一个表格的单元格中插入表格，可以其他表格一样对嵌套表格进行相应的设置，嵌套表格最大的优点在于它为用户提供了最大程度上对网页页面布局进行控制的能力。 表格的嵌套 在网页设计过程中，可以通过多种方法来布局版面，利用Dreamweaver提供的布局视图就可以不使用一般表格模式中的插入表格的对话框，直接通过拖动操作就能够在文档中插入表格和单元格，简化制作表格的烦琐操作，这样我们就能够轻松设计出灵活而复杂的页面。 使用其他模式进行页面布局 创建页布局的一种常用的方法是使用 HTML 表格对元素进行定位。最初创建表格是为了显示表格式数据，而不是用于对网页进行布局；使用嵌套表格进行页面布局的过程，表格的编辑及操作会变得困难，此时Dreamweaver 提供了“扩展表格”模式。 使用扩展表格模式编辑表格 AP 元素（绝对定位元素）就是 div 标签的一种类型。AP 元素可以包含文本、图像或其它任何可放置到 HTML 文档正文中的内容。同表格一样，我们也可以使用 AP 元素来设计页面的布局。同时，由于AP元素的特有属性，我们可以将 AP 元素放置到其它 AP 元素的前后，隐藏某些 AP 元素而显示其它 AP 元素，以及在屏幕上移动 AP 元素等。 使用APIT 使用布局版面进行布局的过程，实际也是绘制表格的过程。根据页面布局的需要，表格可能会比较简单，也可能会非常复杂。利用布局视图，我们可以像绘图一样，在页面上任意位置绘制表格和单元格。 设置AP 元素的属性 使用布局版面进行布局的过程，实际也是绘制表格的过程。根据页面布局的需要，表格可能会比较简单，也可能会非常复杂。利用布局视图，我们可以像绘图一样，在页面上任意位置绘制表格和单元格。 在页面中使用表格进行排版 本章小结 在网页设计中，最常用就是使用表格来定位内容，表格是大家在网页的整体布局中使用最广的。这一方面是因为表格的信息最大，它用最简洁的形式表达繁杂的内容，另一方面它还可以用来控制文本和图像在页面上出现的位置，把文字和图像规范地按照行或列对齐，使整个页面看上去紧凑而统一。这对于复杂版面的网页排版来说，有很大的帮助，对于一个网页设计者来说，如果能够灵活地应用表格，就会让你的网页看上去井井有条、美观大方。 思考与练习 一、选择题 1.在代码视图中，表格使用的标签是（ ） A.td B.table C.tr D.div 2.下列视图中不属于Dream