《Dreamweaver-8基础与实例教程》.pptx

,*,单击此处编辑母版标题样式,第4章 表格应用,1/25,第4章 表格应用,4.1 表格创建,4.2 表格格式化,4.3 导入和导出表格式数据,4.4 对表格进行排序,4.5 实例制作,2/25,4.1表格创建,4.1.1插入表格,4.1.2.,创建嵌套表格,3/25,4.1.1插入表格,1.在文档窗口中，将光标放在需要创建表格位置，在“插入”栏“惯用”类别中，单击“表格”按钮，或选择“插入”菜单下“表格”选项，弹出“表格”对话框。,2.对“表格”对话框中各个参数进行设置,行数：确定表格含有行数目。,列数：确定表格含有列数目。,表格宽度：以像素为单位或按占浏览器窗口宽度百分比指定表格宽度。,边框粗细：指定表格边框宽度。假如您没有明确指定边框粗细值，则大多数浏览器按边框粗细设置为 1 显示表格。若要确保浏览器显示表格没有没有边框，请将边框粗细设置为 0。,单元格边距：确定单元格边框和单元格内容之间像素数。,单元格间距：确定相邻表格单元格之间像素数。,4/25,4.1.2.,创建嵌套表格,表格之中还有表格就叫做嵌套表格。,引入嵌套表格，由总表格负责整体排版，由嵌套表格负责各个子栏目标排版，并插入到总表格对应位置中，各司其职，互不冲突。另外，经过嵌套表格，利用表格背景图像、边框、单元格间距和单元格边距等属性能够得到漂亮边框效果，制作出精美网页。,制作嵌套表格步骤以下：,（1）单击一个表格中单元格，定位插入光标。,（2）选择“插入”菜单中“表格”选项，打开“表格”对话框。,（3）在“表格”对话中，为嵌套表格指定所需要属性，然后单击“确定”按钮，完成操作。,在表格中能够直接输入文字或插入图像，也能够进行文字粘贴。,5/25,4.2表格格式化,4.2.1选择单元格对象,4.2.2 表格HTML代码,4.2.3,设置表格属性,4.2.4设置单元格、行和列属性,4.2.5套用“表格模板”,4.2.6去除表格辅助线,6/25,4.2.1选择单元格对象,1.选中整个表格,要选中整个表格，有以下几个方法：,（1）选择整个表格方法是把鼠标放在表格边框任意处，当鼠标指针右下角出现标志时，单击鼠标左键即可选中整个表格。,（2）在表格内任意处单击，然后在状态栏标签选择器中单击标识，即可选中整个表格。,（3）在单元格任意处单击鼠标右键，在弹出快捷菜单中选择“表格”选项中“选择表格”命令或者按Ctrl+A组合键，即可选中整个表格。,7/25,2.选中表格行,要选中表格行，有以下三种方法：,（1）将鼠标指针移动到表格行左方表格之外位置，当鼠标指针变为一个指向右方黑色箭头形状时，单击鼠标左键即可选中对应表格行。在此基础上，按住鼠标左键，上下拖动鼠标，即可选中多行。,（2）先单击要选中表格行第一个单元格，然后按住鼠标左键拖动鼠标，直到表格行最终一个单元格中，再释放鼠标，即可选中表格行，如图4-4所表示。在此基础上，若继续按住鼠标左键上下拖动鼠标，即可选中多个表格行。,（3）先单击要选中表格行任意一个单元格，然后在状态栏标识选择器中单击标识，即可选中该表格行。,8/25,3.选中表格列,选中表格列方法与选中表格行方法类似，这里不再赘述。,4.选中单元格,（1）在要选择单元格中按下鼠标左键，并拖拽鼠标到相邻单元格中，当单元格四面带有黑色粗框时释放鼠标，即可选中该单元格。,（2）要选中某一单元格，按住Ctrl键，用鼠标在需要选中单元格单击即可。,（3）在要选中单元格单击鼠标左键，然后在状态栏标识选择器中单击标识，即可选中该单元格。,9/25,4.2.2 表格HTML代码,插入表格后，切换到代码模式或拆分模式，都能够看到一个表格代码表示。任何表格都有三个基本要素：表行、表头和表项，每个要素都有自己标签。,其基本定义格式以下：,定义表格；,定义表行,定义表头,定义表项（单元格）,10/25,1.表格尺寸设置,一个表由开始，结束，表格标题和内容全都包含在这两个标识之间。表格整体外观由标识属性决定。主要有以下几项表格属性：,（1）表大小用width=“数值”和height=“数值”属性说明。前者为表宽，后者为表高，数值是为像素数或占窗口百分比。,（2）定义表格粗细由border=“n”说明，n取整数，单位是像素（假如省略，则不带边框）。将border设成不一样值，可产生不一样效果。,（3）表格间距用cellspacing=数值表示，数值单位是像素。,11/25,2.表格内文字布局与对齐,表格中数据排列方式有两种，分别是左右排列和上下排列。左右排列以align属性来设置，而上下排列则由valign属性来设置。其中左右排列位置能够分为三种：居左（left）、居中（center）和居右（right）。上下排列惯用有四种：上对齐（top）、居中（middle）、下对齐（bottom）和基线（baseline）。,12/25,3.表格颜色,在表格中，既能够对整个表格设置底色，也能够对任何一行、一个单元格使用背景色。主要有以下三种：,（1）表格背景颜色：,（2）行背景颜色：,（3）单元格背景颜色：或,注：值为颜色名称。,13/25,4.2.3,设置表格属性,在编辑窗口中，单击表格左上角或在边框线上任意位置双击，即可选中表格，在属性面板中可深入设置表格,14/25,4.2.4设置单元格、行和列属性,表格由很多单元格组成，每个单元格能够设置不一样属性。也能够同时选中多个单元格，设置其共同属性。,15/25,4.2.5套用“表格模板”,在要格式化表格中单击，再使用“命令”菜单中“格式化表格”命令，打开“格式化表格”对话框，在该对话框中选择一个样式，最终按“确定”按钮,16/25,4.2.6去除表格辅助线,方法一：选中表格，单击宽度辅助线上数字和小三角形，从下拉菜单中选择“隐藏表格宽度”，这么，表格宽度辅助线就被去掉了。,方法三：选择“查看”菜单中“可视化助理”选项，在打开级联菜单中单击“表格宽度”选项同。这么也能够删除表格宽度辅助线。,方法二：选择工具栏上“视图选项”图标，从下拉菜单中选择“表格宽度”，这么表格宽度辅助线没有了。,17/25,4.3导入和导出表格式数据,1.导入表格数据,(1)选择“文件”菜单下“导入”选项，在其子菜单中单击“表格式数据”命令，或选择“插入”菜单下“表格对象”选项，在其子菜单中单击“导入表格式数据”。打开“导入表格式数据”对话框,(2）在该对话框中，此对话框允许您指定相关表格式数据文件信息，并指定要使用这些数据创建表格属性。,若要完成“导入表格式数据”对话框，请执行以下操作：,数据文件：是要导入文件名称。单击“浏览”按钮选择一个文件，数据文件能够是纯文本格式，也能够是Excel等软件创建文件，,定界符：是正在导入文件中所使用分隔符，其中有逗号，分号，Tab，引号，其它等几个选项。,设置完成后，单击“确定”按钮，系统完成导入表格数据操作。,18/25,2.导出表格,（1）请将插入点放置在表格中任意单元格中，选择“文件”菜单中“导出”选项，在子菜单中单击“表格”命令。即会出现“导出表格”对话框。,（2）在“导出表格”对话框中，指定导出表格选项。,此对话框允许您设置分隔符和换行符样式以经过从表格中导出数据来创建文本文件。,定界符：指定应该使用哪个分隔符字符在导出文件中隔开各项。,换行符：指定您将在哪个操作系统中打开导出文件：Windows、Macintosh 还是 UNIX。（不一样操作系统含有不一样指示文本行结尾方式。）,设置后单击“导出”按钮，即会出现“表格导出为”对话框，,（3）在该对话框中输入文件名称，单击“保留”，完成导出表格操作。,19/25,4.4对表格进行排序,1.选择该表格或单击任意单元格。选择“命令”菜单中“排序表格”命令。即会出现“排序表格”对话框,2.该对话框允许您指定表格排序方式，若要完成“排序表格”对话框，请执行以下操作：,排序按：能够确定哪个列值将用于对表格行进行排序。,次序：确定是按字母还是按数字次序以及是以升序（A 到 Z，小数字到大数字）还是降序对列进行排序。,再按/次序：确定在不一样列上第二种排序方法排序次序。在“再按”弹出式菜单中指定应用第二种排序方法列，并在“次序”弹出式菜单中指定第二种排序方法排序次序。,排序包含第一行：指定表格第一行应该包含在排序中。假如第一行是不应移动标题，则不选择此选项。,对标题行：进行排序指定使用与 body 行相同条件对表格 thead 部分（假如存在）中全部行进行排序。,对脚注行进行：排序指定使用与 body 行相同条件对表格 tfoot 部分（假如存在）中全部行进行排序。设置完成后，单击“应用”或“确定”按钮，完成操作。,20/25,4.5 实例制作,4.5.1虚线表格,4.5.2几个特殊表格制作,4.5.3圆角表格,4.5.4利用表格排版制作页面,21/25,4.5.1虚线表格,在浏览Internet时，会发觉很多网站排版所用表格都是经过各种美工制作，非常漂亮，不但起到了网页排版作用，而且在很大程度上美化了网页，使网页看起来非常清爽、简练。虚线表格就是其中一个。,22/25,4.5.2几个特殊表格制作,表格在网页设计中能够说是非常主要一个元素，表格利用好坏，直接影响到网页制作精美是否，,23/25,4.5.3圆角表格,在浏览网页时，会看到一些网站使用了圆角表格，比起直角表格，圆角表格更显活泼、自然，让人耳目一新,24/25,4.5.4利用表格排版制作页面,我们在网页中使用表格，能够使数据条理化和清楚化，使我们页面愈加整齐。实际上，表格作用远远不止排列和显示数据，通常网页布局设计是靠表格来实现，它在网面定位上一直起着非常主要作用。,25/25,