边做边学——Dreamweaver CS3网页设计案例教程教学课件 作者 官辛华 05.ppt

《边做边学——Dreamweaver CS3网页设计案例教程教学课件 作者 官辛华 05.ppt》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、本章简介：表格是网页设计中一个非常有用的工具，它不仅可以将相关数据有序地排列在一起，还可以精确地定位文字、图像等网页元素在页面中的位置，使得页面在形式上既丰富多彩又条理清楚，在组织上井然有序而不显单调。使用表格进行页面布局的最大好处是，即使浏览者改变计算机的分辨率也不会影响网页的浏览效果。因此，表格是网站设计人员必须掌握的工具。表格运用得是否熟练，是划分专业制作人士和业余爱好者的一个重要标准。第5章　使用表格课堂学习目标表格的简单操作网页中的数据表格利用表格进行页面布局5.1咖啡机专卖网页案例分析设计理念操作步骤相关工具5.1.1案例分析酿制一杯完美的咖啡，需要借

2、助专门的咖啡机来完成。利用因特网可以足不出户地在网上了解咖啡机的种类和价格。因此，在咖啡机销售网页设计上要根据功能需求，合理进行布局和制作，体现出咖啡的口感和文化特色。5.1.2设计理念在网页设计、制作过程中，将淡雅的浅咖啡色和咖啡机设计为背景图案，表现出咖啡机的品质和咖啡的香浓美味。咖啡色的导航条更为网页的主题增色不少。右下方的图片是咖啡机专卖产品的展示效果，整体设计浪漫温馨，使浏览者能沉浸在咖啡的香气中。咖啡机专卖网页效果图5.1.3操作步骤12345.1.4相关工具表格的组成表格中包含行、列、单元格、表格标题等元素。效果图表格的标题名称2.插入表格要将相关数

3、据有序地组织在一起，必须先插入表格，然后才能有效地组织数据。插入表格的具体操作步骤如下：（1）在“文档”窗口中，将插入点放到合适的位置。（2）通过以下几种方法启用“表格”对话框。选择“插入记录>表格”命令。单击“插入”面板“常用”选项卡上的“表格”按钮。单击“插入”布局“布局”选项卡面板上的“表格”按钮。（3）根据需要选择新建表格的大小、行列数值等，单击“确定”按钮完成新建表格的设置。3.表格各元素的属性插入表格后，通过选择不同的表格对象，可以在“属性”面板中看到它们的各项参数，修改这些参数可以得到不同风格的表格。表格的属性单元格和行或列的属性4.在表格中插入内容

4、建立表格后，可以在表格中添加各种网页元素，如文本、图像、表格等。在表格中添加元素的操作非常简单，只需根据设计要求选定单元格，然后插入网页元素即可。一般当表格中插入内容后，表格的尺寸会随内容的尺寸自动调整。当然，还可以利用单元格的属性来调整其内部元素的对齐方式、单元格的大小等。输入文字插入其他网页元素5.选择表格元素先选择表格元素，然后对其进行操作。用户一次可以选择整个表格、多行或多列，也可以选择一个或多个单元格。选择整个表格选择行或列选择单元格选择一个矩形块区域选择不相邻的单元格6.复制、粘贴表格在DreamweaverCS3中复制表格的操作如同在Word中一样，

5、可以对表格中的多个单元格进行复制、剪切、粘贴操作，并保留原单元格的格式，也可以仅对单元格的内容进行操作。复制单元格剪切单元格粘贴单元格粘贴操作的几点说明7.删除表格和表格内容删除表格的操作包括删除行或列，清除表格内容。清除表格内容删除行或列8.缩放表格创建表格后，可根据需要调整表格、行和列的大小。缩放表格修改行或列的大小9.合并和拆分单元格有的表格项需要几行或几列来说明，这时需要将多个单元格合并，生成一个跨多个列或行的单元格。合并单元格拆分单元格10.增加和删除表格的行和列在实际工作中，随着客观环境的变化，表格中的项目也需要做相应的调整，通过选择“修改>表格”中的

6、相应子菜单命令，可添加、删除行或列。插入单行或单列插入多行或多列5.1.5实战演练-音乐世界网页使用“表格”按钮插入表格，使用“属性”面板改变单元格的大小，使用“图像”按钮插入图像布局网页。效果图5.2设计师家园网页案例分析设计理念操作步骤相关工具5.2.1案例分析设计师家园网是在因特网上专门为设计行业的设计师开设的服务网站，是为设计师提供学习、互相交流和设计参考的网站。本例是为网站中的设计师制作信息表格，重点介绍设计师的相关信息，包话姓名、年龄、工龄、电话等。5.2.2设计理念在网页设计、制作过程中，整个页面采用灰色到黄色的色彩渐变作为背景，表现出艺术性和设计感

7、。导航栏的设计清晰明快，方便用户浏览和查找需要的设计资源。下方是设计师的资料，以不同的颜色块方式显示，体现设计师的年龄和工作经验。设计师家园网页效果图5.2.3操作步骤12345.2.4相关工具1.导入和导出表格的数据有时需要将Word文档中的内容或Excel文档中的表格数据导入到网页中进行发布，或将网页中的表格数据导出到Word文档或Excel文档中进行编辑，DreamweaverCS3提供了实现这种操作的功能。导入Excel文档中的表格数据导入Word文档中的内容将网页中的表格导入到其他网页或Word文档中2.排序表格日常工作中，常常需要对无序的表格内容进行排

8、序，以便浏