Dreamweaver CS5.5中文版案例教程教学课件 作者 教学课件第5章5.ppt

《Dreamweaver CS5.5中文版案例教程教学课件 作者 教学课件第5章5.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第5章使用表格和层页面布局是进行网页设计最基本和最重要的工作之一。网页布局设计的常用工具是表格，合理布局表格，会使网页更具有自己的个性特点，又便于管理和修改。Dreamweaver提供了3种方式来查看和操作表格：标准视图、扩展视图和布局视图。在标准视图中，表格显示为行和列的网格，而布局视图允许在将表格用做基础结构的同时在网页上进行绘制、移动，以及调整布局表格和布局单元格的大小，在扩展视图中可以了解表格的结构关系。本章主要讲解制作表格的方法、表格数据的处理及使用表格进行页面布局。第5章使用表格和层5.1.1插入表格在DreamweaverCS5.5中，表格可以用于制作简单的图表，还可以用于安

2、排网页文档的整体布局，在网页整体设计中起着非常重要的作用。表格不但能够记载表单式的资料、规范各类数据和输入列表式的文字，而且还可以排列文字和图像。第5章使用表格和层5.1.2选择表格像处理文本或图像一样，对表格进行操作时首先需要选择表格,然后才是修改、编辑。主要有以下几种方法选择表格。第5章使用表格和层5.1.3调整表格和单元格的大小在文档中插入表格后，若想改变表格的高度和宽度可以先选中该表格，在出现3个控制点后将鼠标指针移动到控制点上，当鼠标指针变成如图5-10和图5-11所示的形状时，按住鼠标左键并拖动即可改变表格的高度和宽度。第5章使用表格和层5.1.4添加或删除行或列表格创建后，可

3、能需要添加内容而添加行或列。用户可以使用不同的方法在表格中几乎任何地方添加行或列。第5章使用表格和层5.1.5拆分单元格在使用表格的过程中，有时需要拆分单元格以达到最终的效果。第5章使用表格和层5.1.6合并单元格合并单元格就是将选中的单元格内容合并到一个单元格中，选中要合并的单元格，选择“修改”→“表格”→“合并单元格”菜单命令，如图5-20所示，此时会打开“合并单元格”对话框，单击“合并单元格”按钮，将单元格进行合并，效果如图5-21所示。5.2设置表格及其元素属性5.2.1设置表格属性在DreamweaverCS5.5中为了使创建的表格更加美观、醒目，需要对表格属性进行设置。可以在表

4、格的“属性”面板中对表格的属性进行详细的设置，在设置表格属性之前首先要选中表格。表格的“属性”面板如图5-22所示。5.2设置表格及其元素属性5.2.2设置单元格的属性将光标置于单元格中，该单元格就处于选中状态，此时“属性”面板中显示出所有允许设置的单元格属性的选项，如图5-23所示。5.3导入表格式数据Dreamweaver可以将在另一个应用程序（如MicrosoftExcel）中创建并以分隔文本的格式（其中的项以制表符、逗号、冒号或分号隔开）保存的表格式数据导入到Dreamweaver中，并设置为表格格式。5.4插入APDivDiv元素体现了网页技术的一种延伸，是一种新的网页设计发展方

5、向。有了Div元素就可以在网页中实现诸如下拉菜单、图片、文本的各种效果等。另外，使用Div元素和CSS样式表也可以实现页面的排版和布局。5.4插入APDiv5.4.1创建普通APDiv在DreamweaverCS5.5中有两种插入APDiv的方法，一种是通过菜单创建，一种是通过“插入”面板创建。在网页中插入APDiv的具体操作步骤如下。5.4插入APDiv5.4.2创建嵌套APDiv在DreamweaverCS5.5中，一个APDiv里还可以包含另一个APDiv，也就是嵌套APDiv，嵌套的APDiv称为子APDiv，子APDiv外面的APDiv称为父APDiv。5.4.2创建嵌套APDi

6、v将光标置于文档窗口中的已有APDiv中，选择“插入”→“布局对象”→“APDiv”菜单命令，即可创建嵌套APDiv，如图5-31所示。5.5设置APDiv的属性与其他对象一样，APDiv元素也有自己的“属性”面板，在“属性”面板中可以分为对每个APDiv元素或几个APDiv元素进行单独设定。单击APDiv元素边界将其选中，即可出现如图5－32所示的“属性”面板。5.6使用Spry布局对象Spry框架支持一组用标准HTML、CSS和JavaScript编写的可重用构件，可以方便地插入这些构件（采用最简单的HTML和CSS代码），然后设置构件的样式。框架行为包括允许用户执行下列操作的功能：显

7、示或隐藏页面上的内容、更改页面的外观（如颜色）与菜单交互等。5.6使用Spry布局对象5.6.1使用Spry菜单栏菜单栏构件是一组可导航的菜单按钮，当用户将鼠标指针悬停在其中的某个按钮上时，将显示相应的子菜单。使用菜单栏构件可在紧凑的空间中显示大量的可导航信息，并使用户无需深入浏览站点即可了解站点上提供的内容。5.6使用Spry布局对象5.6.2使用Spry选项卡式面板选项卡式面板构件是一组面板，用来将内容排列到紧凑空间