DreamweaverCC2015中文版案例教程第2版全套配套课件教学资源第7章.pptVIP

第7章 使用表格及框架布局 页面布局是进行网页设计最基本和最重要的工作之一。网页布局设计的常用工具是表格，合理布局表格，会使网页更具有自己的个性特点，又便于管理和修改。框架是一个较早出现的HTML对象，框架的作用就是把浏览器窗口划分为若干个区域，每个区域可以分别显示不同的网页。使用框架可以非常方便地完成导航工作，而且各框架之间决不会存在干扰问题。本章主要讲解制作表格的方法、表格数据的处理及使用表格、框架进行页面布局。 7.1 创建表格 表格由行、列、单元格3个部分组成，使用表格可以排列页面中的文本、图像以及各种对象。表格的行、列和单元格都可以复制及粘贴。并且在表格中还可以嵌套表格，通过表格嵌套布局页面也是一种简单方便的布局形式。 7.1 创建表格 7.1.1 表格对话框 单击“插入”面板上的“表格”按钮，弹出“表格”对话框，在该对话框中可以设置表格的行数、列数、表格宽度、单元格间距、单元格边距、边框粗细等选项。 7.1 创建表格 7.1.2 插入表格 在Dreamweaver CC 2015中，表格可以用于制作简单的图表，还可以用于安排网页文档的整体布局，在网页整体设计中起着非常重要的作用。 7.1 创建表格 7.1.3 选择表格 像处理文本或图像一样，对表格进行操作时首先需要选择表格, 然后才是修改、编辑。主要有以下几种方法选择表格。 7.1 创建表格 7.1.4 调整表格和单元格的大小 在文档中插入表格后，若想改变表格的高度和宽度可以先选中该表格，在出现3个控制点后将鼠标指针移动到控制点上，当鼠标指针变成如图7-11和图7-12所示的形状时，按住鼠标左键并拖动即可改变表格的高度和宽度。 7.1 创建表格 7.1.5 添加或删除行或列 表格创建后，可能需要添加内容而添加行或列。用户可以使用不同的方法在表格中几乎任何地方添加行或列。 7.1 创建表格 7.1.6 拆分合并单元格 在使用表格的过程中，有时需要拆分单元格以达到最终的效果。拆分单元格就是将选中的单元格拆分为多行或多列， 7.2 设置表格及其元素属性 7.2.1 设置表格属性 在Dreamweaver CC 2015中为了使创建的表格更加美观、醒目，需要对表格属性进行设置。可以在表格的“属性”面板中对表格的属性进行详细的设置，在设置表格属性之前首先要选中表格。 表格是常见的页面元素，由行、列、单元格3个部分组成，我们可以通过选择表格或组成表格的单元格，来通过属性面板设置其属性。 7.2 设置表格及其元素属性 将光标置于单元格中，该单元格就处于选中状态，此时“属性”面板中显示出所有允许设置的单元格属性的选项， 7.2.2 设置单元格的属性 7.3 表格的高级处理技巧 针对表格数据的处理需要，在Dreamweaver中还提供了对表格数据进行排序、导入表格数据和导出表格数据的高级操作技巧，通过这些技巧的应用，可以更加方便、快捷地对表格数据进行处理。 7.3.1 导入表格式数据 Dreamweaver可以将在另一个应用程序（如 Microsoft Excel）中创建并以分隔文本的格式（其中的项以制表符、逗号、冒号或分号隔开）保存的表格式数据导入到 Dreamweaver 中，并设置为表格格式。 7.3 表格的高级处理技巧 7.3.2 导出表格式数据 7.3 表格的高级处理技巧 7.3.3 使用CSS实现表格特效 在网页中使用表格来表现数据内容时，有时数据量比较大，表格的行和列就比较多。通过CSS样式，可以实现一些表格的特殊效果，从而使数据信息更加有条理，不至于非常凌乱。 7.4 使用iFrame框架布局网页 iFrame框架是一种特殊的框架技术，iFrame框架比框架更加容易控制网站的内容。但是，由于Dreamweaver CC 2015中并没有提供iFrame框架的可视化制作方案，因此需要手动添加一些页面的源代码。 7.4.1　制作iFrame框架页面 7.4 使用iFrame框架布局网页 7.4.2　iFrame框架页面链接 7.5 知识与技能梳理 在网页设计中，表格除了可以用来定位内容，用最简洁的形式表达复杂的内容，还可以用来控制文本和图像在页面上出现的位置，把文字和图像规范地按照行或列对齐，使整个页面看上去紧凑而统一。这对于复杂版面的网页排版来说，有很大的帮助，对于一个网页设计者来说，如果能够灵活地应用表格，会让设计的网页看上去井井有条、美观大方。 重要工具：表格、AP Div。 核心技术：利用AP Div制作可以重叠、便于移动和下拉菜单效果。 实际应用：企业网站、旅游网站、个人主页。