Dreamweaver MX网页设计与制作 作者 曾立 第2章.pptVIP

Dreamweaver网页设计和制作 第2章 表格 第2章表格布局技术 2.1 表格的基本操作 2.2 使用表格制作网页 简介 网页是由文字、图片、动画等静态和动态的一些网页元素构成的，如何合理地组织这些元素，使之整齐、美观，首先需要一个整体布局的概念，在Dreamweaver MX中主要依靠表格的相互嵌套、合并、拆分来完成。本章主要介绍表格在网页布局中的应用。 本章任务 学会表格的建立与修改 掌握表格的嵌套使用 能够熟练地利用表格制作出一个布局整齐的网页 2.1 表格的基本操作 插入表格 在表格中添加内容 从其他文档导入表格式数据 嵌套表格 插入表格的方法 通过“插入”面板上的“表格”按钮 选择“插入”菜单—“表格” 命令 在弹出的对话框中设置，表格的行和列 设置表格的“宽度” （注意行和列的单位） 设置表格的 “边框”、 “单元格填充”和“单元格间距” （特别强调“边框”、 “单元格填充”和“单元格间距” 之间的关系） “表格”属性 行数：定义表格行的数目。 列数：定义表格列的数目。 表格宽度：以像素为单位或按占浏览器窗口宽度的百分比来定义该表格在浏览器中的显示宽度。 边框粗细：指定表格边框的宽度（以像素为单位）。 单元格边距：确定单元格边框和单元格内容之间相距的像素数。 单元格间距：确定相邻的表格单元格之间相距的像素数。 如果没有明确指定单元格间距和单元格边距的值，则大多数浏览器按单元格边距设置为“1”，单元格间距设置为“2”显示表格。若要确保浏览器不显示表格中的边距和间距，大多数情况下将“单元格边距”和“单元格间距”设置为“0”。 表格中添加内容 将光标定位在要插入对象的位置 输入文本，或者选择“插入栏”的“常用”选项卡中单击对应的对象 从其他文档导入表格式数据 选择“文件”菜单—“导入”，可导入相应的数据 嵌套表格 嵌套表格是指在一个表格的单元格中再插入一个表格。嵌套表格的宽度受所在单元格的宽度的限制，嵌套表格的编辑方法与表格相同。 嵌套表格的具体操作 （1）将光标定位到要插入表格的单元格中。 （2）在“插入栏”的“常用”选项卡中单击 按钮，打开“插入表格”对话框。 （3）根据实际需要分别在行数、列数、宽度和边框等项中指定嵌套表格的属性。 （4）设置完成后单击 按钮即可。 表格基本操作 选定操作 单元格的合并及拆分 插入或删除行或列 合并单元格 （1）选取要合并的单元格区域 （2）单击“属性”面板左下角的 按钮，合并后的效果如 表格属性设置 表格属性的设置 单元格属性设置 表格属性的设置 选取表格，展开“表格”属性面板 综合练习 * * 在线教务辅导网： 教材其余课件及动画素材请查阅在线教务辅导网 QQ:349134187 或者直接输入下面地址： 在网页设计中，页面布局是一个重要的部分。Dreamweaver MX提供了多种方法来创建和控制网页布局，最普通的方法就是使用表格，使用表格可以简化页面布局设计过程、导入表格化数据、设计页面分栏及定位页面上的文本和图像等。 此时默认的边框粗细为没有，没有粗细并不代表粗细就为0，根据不同浏览器确定的粗细不同，若要确保浏览器不显示表格边框，需将边框粗细设置为“0”。 若要在边框粗细设置为“0”时查看单元格和表格边框，可选择“查看”菜单—“可视化助理”—“表格边框”命令。 “单元格填充”和“单元格间距”情况相同 单元格边框与其中内容之间的空白，其默认值为1像素 表格中每个单元格之间的距离，默认值为2像素 1、此时应准备些数据文件，比如文本文件、EXCLE、WORD……，让学生行行导入，然后老师再进行拓展。 2、如果是EXCLE、WORD对象，会在网页中生成很多重复的代码，应选择“命令”菜单—清理WORD生成的HTML 注意：当嵌套表格表格的宽度和高度超过外面表格时，应该采取的方法： 1、调整外部表格的宽或者高 2、调整嵌套表格的宽或者高，最佳方式为把嵌套表格的宽和高单位修改百分比。 单元格的选取 单元格的选取分为单个单元格的选取和单元格区域的选取两种情况。 单个单元格的选取方法很简单，只需将光标定位到要选取的单元格中即可。 拆分单元格 （1）将光标定位要拆分的单元格中。 （2）单击“属性”面板中的 按钮，打开 “拆分单元格”对话框。 （3）在“把单元格拆分”栏中选中 单选项。 设置对应的属性 *