Dreamweaver 课件 第7章_ppt.txt
大学DREAMWEAVER 8案例教程-课件PPT
收藏
资源目录
压缩包内文档预览：
编号：21836135
类型：共享资源
大小：28.17MB
格式：ZIP
上传时间：2019-09-06
上传人：QQ24****1780
认证信息
个人认证
王**（实名认证）
浙江
IP属地：浙江
25
积分
- 关 键 词：
-
大学DREAMWEAVER
8案例教程-课件PPT
大学
dreamweaver
案例
教程
课件
ppt
- 资源描述：
-
大学DREAMWEAVER 8案例教程-课件PPT,大学DREAMWEAVER,8案例教程-课件PPT,大学,dreamweaver,案例,教程,课件,ppt
- 内容简介：
-
第 7 章 页面布局规划本章学习目标7.1 创建表格 表格广泛地应用于网页设计中，无论在数据显示方面还是在定位排版方面都起着不可替代的作用，下面就详细介绍如何在网页中创建表格。7.1.1 插入表格 在文档中创建表格的步骤如下： （1）在Dreamweaver 8.0中单击“插入”“表格”菜单命令，弹出属性设置窗口，对所要插入的表格进行初步定义，如图7-1所示。 （2）在参数设置窗口中根据需要设置参数。 （3）单击窗口中的“确定”按钮之后，即可在文档中光标所做位置插入一个表格。7.1.1 插入表格图7-1 表格参数设置7.1.2 在表格中添加内容 创建好表格以后，现在可以直接在表格中填充信息，如下图所示。图7-2 在表格中添加内容7.1.3 导入/导出数据 1. 导入文本：(1)在设计视图中，将光标放在需要插入文本的地方；(2)导入文本文件：将鼠标指针置入所要导入数据的单元格内，选择“文件”|“导入”|“Word文档”菜单项，此时弹出“打开”对话框，在其中找到要导入的文本文件，然后单击“确定”按钮即可。2. 导入Excel文档：(1)在设计视图中，将光标放在需要插入Excel文档的地方；(2)导入Excel文档：选择“文件”|“导入”|“Excel文档”菜单项，在弹出的“打开”对话框中选择要导入的Excel文档，然后单击“打开”按钮，选择的Excel文档即可被导入表格中。 7.1.3 导入/导出数据3. 导入表格：(1)在设计视图中，将光标放在需要插入表格式数据的地方；(2)执行“文件”|“导入”|“表格式数据”命令 。(3)这时会弹出如图7-3所示的对话框，通过这个对话框可以对数据源以及参数进行选择。图7-3 设置导入数据参数 7.1.3 导入/导出数据4. 导出表格： (1)打开需要导出表格的HTML文档，并将光标放到表的的单元格中。 (2)在菜单中选择执行“文件”|“导出”|“表格”命令，这时会弹出一个对话框。 (3)在“定界符”下拉列表中选择将要生成的表格数据文件的分隔符类型。 (4)在“换行符”下拉列表中选择断行类型。 (5)按下“导出”按钮就会弹出保存文件对话框，输入文件名和路径后按下“保存”按钮，即可将表格输出为数据文件。7.1.4 选择表格元素 （1）选取整个表格，可以执行下列操作步骤之一： 方法一：点击表格左上角，或点击右边或底边任意位置 方法二：单击表格并选择“修改”|“表格”|“选择表格”。 方法三：单击表格并选择“编辑”|“全选”。 方法四：将光标放到表格内任意位置，选取文档窗口左下角标签选择器中的 标签。7.1.4 选择表格元素 （2）选取行或列，可以执行下列操作步骤之一： 方法一：将光标置于行的左边空白处或者列的顶部。当选取箭头出现时点击，如图7-11和7-12所示。 方法二：点击一个单元格，横向或纵向拖拽可以选取多个行或列。 方法三：将插入点放到表格内，选取文档窗左下角标签选择器中的 标签。7.1.4 选择表格元素 （3）要选取不相邻的单元格，可以执行下列操作步骤之一： 方法一：按住【Ctrl】键点击表格内部来增加单元格、行或列到选集中。 方法二：选取表格内多个单元格，然后按住【Ctrl】键并点击单元格，行或列取消对某些单元格的选取。 7.2 格式化 表格制作好了，内容也有了，但是表格看起来还不太美观，这时需要对表格进行修饰格式化表格。表格的格式化主要包括表格的对齐方式，间距与边距的调整，边框的设置以及背景的设置等。本节我们将学习如何设置表格。7.2.1 设置表格属性 对于表格总体属性的设置，主要是通过属性面板来完成。选中整个表格，这时的属性面板如图7-4所示。图7-4 表格的属性面板 7.2.2 设置单元格，行和列的属性 按照前面介绍的方法，选中某一个单元格，或者是某一行、某一列，这时的属性面板如图7-5，7-6，7-7所示。图7-5 单元格的属性面板 图7-6 行的属性面板 图7-7 列的属性面板 7.2.3 设置预置表格类型 单击已经创建好的表格的边框，以选中该表格，然后选择“命令”|“格式化表格”菜单项，弹出“格式化表格”对话框，如图7-8所示。图7-8 格式化表格7.3 编辑表格的单元格 在Dreamweaver 8.0中，表格创建完成后，不仅可以设置其格式，而且还可以对单元格进行编辑，如拆分/合并单元格，复制单元格，增加/删除行列，对表格中的数据进行排序等，这些内容将在本节中详细介绍。7.3.1 调整表格列宽与行高 1、调整列宽： （1）选中要调整列宽的那一列表格； （2）在属性面板中设置该列表格的宽度值，单位是像素，例如 此时将列宽设置为20像素，属性面板如图7-9所示。图7-9 列的属性面板7.3.1 调整表格列宽与行高 2、调整行高： （1）选中要调整行高的那一行表格； （2）在属性面板中设置该行表格的高度值，单位是像素，例如此 时将行高设置为15像素，属性面板如图7-10所示。图7-10 行的属性面板7.3.2 增加/删除行或列 （1）增加行： 方法一：把光标定位在要在其上面或下面插入行的一个单元格内，单击“插入”|“表格对象”命令，在子菜单中根据实际需要选择“在上面插入行”或“在下面插入行”。 方法二：选中要在其下面插入行的整行单元格，单击鼠标右键，从弹出的快捷菜单中选择“表格”|“插入行”，这时就在该行的下面插入了新的一行。 方法三：选中要在其上面或下面插入行的整行单元格，单击鼠标右键，从弹出的快捷菜单中选择“表格”|“插入行或列”，这时弹出一个对话框。7.3.2 增加/删除行或列 （2）增加列： 方法一：把光标定位在要在其左边或右边插入列的一个单元格内，单击“插入”|“表格对象”命令，在子菜单中根据实际需要选择“在左边插入列”或“在右边插入列”。 方法二：选中要在其右边插入列的整列单元格，单击鼠标右键，从弹出的快捷菜单中选择“表格”|“插入列”，这时就在该列的右边插入了新的一列。 方法三：选中要在其左边或右边插入列的整列单元格，单击鼠标右键，从弹出的快捷菜单中选择“表格”|“插入行或列”，这时弹出一个对话框。 7.3.2 增加/删除行或列 （3）删除行： 方法一：选中要删除的整行单元格，单击“修改”|“表格”|“删除行”命令，这时该行就被自动删除。 方法二：选中要删除的整行单元格，单击鼠标右键，从弹出的快捷菜单中选择“表格”|“删除行”，同样，该行也会被删除。（4）删除列： 方法一：选中要删除的整列单元格，单击“修改”|“表格”|“删除列”命令，这时该列就被自动删除。 方法二：选中要删除的整列单元格，单击鼠标右键，从弹出的快捷菜单中选择“表格”|“删除列”，同样，该列也会被删除。7.3.3 剪切/复制/粘贴单元格 1. 剪切或复制单元格： (1)选择要复制或剪切的单元格。既可以选择一个单元格，也可以选择多个单元格，但要保证选中的单元格区域呈矩形。 (2)单击“编辑”|“剪切”命令，即可将选中的单元格剪切到剪贴板上；单击“编辑”|“拷贝”命令，即可将选中的单元格复制到剪贴板上。2. 粘贴单元格： (1)选择要粘贴数据的目标对象。如果希望将数据粘贴入单元格内，可以单击该单元格，将光标放置到该单元格内；如果希望将剪贴板中的数据粘贴入一个新的表格，可以在文档中将插入点放置到该位置上。 (2)单击“编辑”|“粘贴”命令，即可进行粘贴。同样，如果单击鼠标右键，在弹出的快捷菜单中选择“粘贴”命令，也能完成粘贴操作。7.3.4 拆分/合并单元格 (1) 拆分单元格： 方法一：选中要拆分的单元格，单击鼠标右键，从弹出的快捷菜单中选择“表格”|“拆分单元格”命令，或者在单元格的属性面板上单击拆分单元格的图标也可以。 方法二：单击“修改”|“表格”|“拆分单元格”命令，也能完成拆分单元格的操作。 方法三：将光标放置到要拆分的单元格中，单击“修改”|“表格”|“减少行宽”命令，可以将当前单元格拆分为两行；单击“修改”|“表格”|“减少列宽”命令，可以将当前单元格拆分为两列。7.3.4 拆分/合并单元格 （2）合并单元格： 方法一：选中要合并的多个连续单元格，选择时要保证选中的单元格区域呈矩形，然后单击鼠标右键，从弹出的快捷菜单中选择“表格”|“合并单元格”命令，或者在单元格的属性面板上单击合并单元格的图标也可以。这时选中的多个单元格会合并为一个大的单元格。 方法二：单击“修改”|“表格”|“合并单元格”命令，也能完成合并单元格的操作。 方法三：将光标放置到要合并的一个单元格中，单击“修改”|“表格”|“增加行宽”命令，可以将当前单元格和它下面的一个单元格合并成一个大的单元格；单击“修改”|“表格”|“增加列宽”命令，可以将当前单元格和它右边的一个单元格合并成一个大的单元格。7.3.5 数据排序 (1) 选中表格，单击“命令”|“排序表格”菜单项，这时会弹出一个“排序表格”的对话框，如图7-11所示。图7-11 排序表格对话框7.3.5 数据排序 （2）在“排序按”下拉列表中选择以哪列作为排序依据。（3）在“顺序”下拉列表中可以设置排序的方式，包括“按字母顺序”和“按数字顺序”两种。同时可以设置按照“升序”或“降序”来排列。（4）在“再按”下拉列表中，可以选择以哪列作为第二排序依据，其设置方法同上。（5）在“选项”复选框中，有四种选择。如果选中“排序包含第一行”，则在对表格数据排序时，同时也对首行进行排序，有时表格的首行是标题行，则可以清除该复选框。如果选中“排序标题行”或“排序脚注行”，则是对标题行或脚注行进行排序。如果选中“完成排序后所有行颜色保持不变”，则在对表格排序后保留排序行中标记的原有属性。（5）设置完毕，单击“确定”按钮，表格即被重新排序。7.4 网页布局 Dreamweaver 8.0中有一个非常重要的功能，就是利用布局来给网页排版。在“布局”下，我们可以在网页中直接画出表格与单元格，还可以自由拖动。利用“布局”来对网页定位非常方便，但生成的表格比较复杂，不适合大型网站使用。7.4.1 布局视图 “布局视图”的具体用法如下所示： （1）将对象面板切换到“布局”面板组，单击“布局”按钮进入“布局模式”。 （2）在“布局”面板上许多以前不可用的按钮变为可用状态。其中有两个按钮，一个是“布局表格”按钮 ，允许用户像绘图一样在页面里绘制表格，进行表格布局；另一个是“绘制布局单元格”按钮 ，可以用于在表格中直接绘制单元格。7.4.2 布局表格和单元格 1.绘制表格： 打开“布局模式”，在对象面板中单击“布局表格”按钮，然后在文档窗口中绘制表格。如图7-12所示，我们可以拖动表格的边框来调整它的大小。图7-12 绘制的表格布局7.4.2 布局表格和单元格 2.绘制单元格： 在对象面板中单击“绘制布局单元格”按钮 ，在鼠标变成“+”时在面板中拖动绘制单元格。如图7-13所示。图7-13 拖动绘制的单元格7.4.2 布局表格和单元格 绘制完成后，在“布局”对象面板中按下“标准模式”按钮，则刚刚绘制的布局会全部转换成表格，如图7-14所示。我们可以任意调整表格，也可以回到“布局模式”中继续绘制。图7-14 标准模式下的表格7.5 框架的应用 前面我们介绍了很多网站的页面都是用表格制作的，其实还有一种更方便的工具，这就是框架。使用框架不仅能够让站点具有统一的风格，而且利用框架制作的页面链接也具有较强的优势，方便浏览页面。7.5.1 框架简介 框架包含两部分，一部分是框架，另一部分就是框架集。框架集定义了一个在窗口中显示的框架数以及框架内的网页等，框架则是指框架集中包含的网页，也就是显示区域。框架的作用就是把浏览器窗口划分为若干个区域，每个区域可以分别显示不同的网页。 7.5.1 框架简介7.5.2 创建框架及框架集 （1）创建框架集： 首先创建一个空白文档，在此文档的基础上构建框架。 然后用鼠标拖动文档窗口四周显示的框架边框，当鼠标变成双箭头时，将它移动到所希望的位置上，释放鼠标，即可构建框架。（2）插入预置的框架集： 单击“插入”|“HTML”|“框架”命令，有可供选择的多种框架集样式，选择其中一种就可以直接插入了。 每插入一个新的框架集，都会生成一个框架集HTML文档以及若干个框架HTML文档。如果在一个框架集中插入另一个框架集，我们称之为嵌套框架集。 7.5.2 创建框架及框架集 （3）新建框架集： 单击“文件”|“新建”菜单项，打开“新建文档”对话框，在“新建文档”对话框中单击“常规”选项卡，选择“框架集”，如图7-15所示。7.5.2 创建框架及框架集 图7-15 新建“框架集”对话框7.5.3 设置框架和框架集属性 （1）设置框架属性： 首先单击“窗口”|“框架”菜单项，打开“框架”面板。要设置某个框架的属性，必须先选中它，可以直接在“框架”面板上单击对应的框架区域，被选中的框架区域四周会出现黑色边框。 选中框架后，就可以在属性面板设置其属性，框架的属性面板如图7-16所示。图7-16 框架的属性面板7.5.3 设置框架和框架集属性 （2）设置框架集属性： 单击“框架”面板四周的框架边框，选中框架集，这时整个“框架”面板区域四周显示粗黑边框。 选中框架集后，就在属性面板中设置其属性，框架集的属性面板如图7-17所示。图7-17 框架的属性面板7.5.4 插入框架内容 （1）创建框架和框架集。单击“文件”|“新建”菜单项，打开“新建文档”对话框，参数设置如图7-18所示。图7-18 新建“框架集”对话框7.5.4 插入框架内容 （2）保存框架及框架集。单击“文件”|“保存全部”菜单项，保存时将上面的框架命名为“topFrame”，下部左侧的框架命名为“leftFrame”，下部右侧的框架命名为“mainFrame”。 （3）设置topFrame框架的属性。在属性面板中设置topFrame框架的属性。 （4）设置leftFrame框架的属性。在属性面板中设置leftFrame框架的属性。 （5）设置mainFrame框架的属性。在属性面板中设置mainFrame框 架的属性。 （6）设置topFrame框架内的页面属性。选中“topFrame”框架，单击“修改”|“页面属性”菜单项，弹出一个名为“页面属性”的对话框，在其中设置参数。 （7）设置leftFrame框架内的页面属性。选中“leftFrame”框架，单击“修改”|“页面属性
- 温馨提示:
1: 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
2: 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
3.本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
人人文库网所有资源均是用户自行上传分享，仅供网友学习交流，未经上传用户书面授权，请勿作他用。
|
2:不支持迅雷下载,请使用浏览器下载
3:不支持QQ浏览器下载,请用其他浏览器
4:下载后的文档和图纸-无水印
5:文档经过压缩，下载后原文更清晰
|
川公网安备: 51019002004831号