网页设计与制作第3章表格的使用.ppt

第3章 表格的使用 3.1 创建表格 3.2 编辑表格 3.3 布局视图模式 3.4 用表格布局网页 3.1 创建表格 表格在网页中是一种用途广泛的工具。它可以有序地排列数据，更重要的是可以精确定位文本、图像及其他网页元素。表格是由行和列组成 . 3.1 创建表格 单元格：由行和列相交所产生的区域。 单元格填充：单元格中的内容与单元格边框之间的距离。 单元格间距：单元格与单元格之间的空间大小。 3.1 创建表格 3.1.1 建立表格 3.1 创建表格 3.1.2 在表格中添加内容 表格建立好后，就可以向表格中添加内容了。例如文本、图像、表格等网页元素。文本可直接输入，随着文本的增多，表格会自动增高。 在单元格中插入图像同文档插入图像方法相同，如果单元格的尺寸小于图像的尺寸，则图像插入后，单元格会自动增高或增宽。 如果在表格的单元格继续插入表格，就构成了嵌套表格，内嵌表格可以将一个单元格分成许多行和列。内嵌表格越多，浏览器所花费的下载时间越长，因此一般内嵌的表格最多不超过3 层。 3.2 编辑表格 表格建立好，就可以对它进行编辑。编辑表格要先选择表格对象。表格对象的选择包括选择行、选择列、选择单元格、选择整个表格。   3.2 编辑表格 3.2.1 选择表格对象 3.2.2 设置表格属性 3.2.3 设置行、列与单元格属性 3.2.4 增加、删除行或列 3.2.5 表格的快速格式化 3.2.6 创建细线表格 3.2.7 表格的其他操作 3.2.1 选择表格对象 1．选择整个表格 有多种方法，这里介绍两种: 单击表格的边框线，选定表格 将光标移到要选择的表格内，单击状态栏的 “table”标签。  2．选择行 将鼠标指针置于表格行最左侧，会变为指向右侧的粗黑箭头，单击即选中此行。选中后上下拖动鼠标，可选中多行。 将光标移到要选择的行中，然后单击状态栏的“tr”标签，可选择此行。 3．选择列 将鼠标指针置于表格列最上方，会变为指向下侧的粗黑箭头，单击即选中此行。选中后左右拖动鼠标，可选中多列。 4．选择单元格 只要在想选择的单元格内单击，即选择了该单元格。状态栏上的td标签处于选中的状态， 5．选择不相邻的单元格、行或列 按住Ctrl键，依次单击，可选中不相邻的单元格、行或列。 在已选择的连续单元格、行或列中按住Ctrl键，然后单击不需选中的单元格、行或列。 3.2.2 设置表格属性 【表格的ID】：如果要在网页中使用JavaScript语言来控制表格，就需 要为表格的取名。 【行和列】：设置表格的行数和列数，这两个值必须给定。重新设置行和列，可以增加或减少表格行数或列数。 【宽和高】：设定表格的宽度和高度。单位可以是像素或百分比。表格的宽度值必须给定。而高度值可以不设定，由实际内容来决定表格的高度。通过设置表格的宽度和高度可以改变表格的大小。当然也可以拖动边框线来改变表格的大小，但这种方法不准确。 【填充】：设定单元格内容与边距之间的距离。对应表格的属性“cellpadding”。 【间距】：单元格与单元格之间的距离。对应表格的属性“cellspacing”。 若不指定填充和间距的值，则多数浏览器按填充为1、间距为2来显示表格。 3.2.2 设置表格属性 【对齐】：设定表格的对齐方式，有4 个选项：【默认】、【居中对齐】、【左对齐】、【右对齐】。选择【默认】选项，则按左对齐显示。 【边框】：设定表格边框的宽度，单位为像素。绝大多数浏览器以三维线条显示表格，若设值为0，表示没有边框。可以在编辑状态下选择【查看】/【可视化助理】/【表格边框】命令，显示表格的虚线框。【背景颜色】：设置表格的背景颜色。 【背景图像】：设置表格的背景图像。 【边框颜色】：设置表格的边框颜色。 和按钮：清除行高和列宽。 和按钮： 根椐当前值，把列宽转换为像素值和百分比。 和按钮：根椐当前值，把行高转换为像素值和百分比。 3.2.3 设置行、列与单元格属性 选定表格的行、列或单元格，【属性】面板显示的参数基本是相同。如图3-5所示。通过【属性】面板可以重新设置所选对象。 3.2.4 增加、删除行或列 增加、删除表格的行数或列数，除了可以通过【属性】面板重新定义表格的行数、列数这种方法外，还可以通过菜单命令来实现。步骤： 将光标定位于要插入新行（列）的单元格。 要增加一行，选择菜单【修改】/【表格】/【插入行】命令，或单击右键，选择快捷菜单中的【表格】/【插入行】命令。则在光标所在单元格的上面增加了一行。 要增加一列，选择菜单【修改】/【表格】/【插入列】命令，或单击右键，选择快捷菜单中的【表格】/【插