《第5章在Web中加入表格.ppt》由会员分享，可在线阅读，更多相关《第5章在Web中加入表格.ppt（11页珍藏版）》请在三一文库上搜索。
1、,表 格,加入表格 一、表格将文本和图像按行、列排列、它和列表一样，有得于表达信息。同时，表格往往在主页中用来建立主页的框架，使整个页面更规则地放置图片和空白，并使条目清晰。 1、建立简单表格 最简单的表格公包括行和列。 格式： 表头l表头2表头n 表项l表项2表项n 表项l表项2表项n 说明：在浏览器中，标记的文字按粗体显示，标记的文字按正常字体显示。 表格的整体外观由标记的属性决定：,Border 定义表格边框的粗细，n取整数，单位是像素（如果省略， 则不带边框。 Width 定义表格的宽度，x 为像素或占窗口的百分比； Height 定义表格的高度，y为像素或占窗口的百分比； Cells
2、pacing 定义表项间隙，单位是像素； Cellpadding 定义表项内部空白，单位是像素。 也可在第一列加表头，其格式为： 表头表项表项n 表头2表项1表项n 表头n表项表项n 说明：数值太小不中以显示表格中的内容时，会自动以最小的宽度显示。,（建立有框线和无框线简单表格）举例(5-8)：预览： （设置表格的尺寸以及表项间隙、表项内部空白） 举例(5-9)：预览： 、给表格加上标题 格式： 标题 其中：valign 设置标题放在表的上部top(缺省),还是下部bottom; Align 设置标题放在表的上部或下部的中间center(缺省），左边left,还是右边right;也可设置标题放
3、在表的上部(缺省),还是下部bottom。 举例（5-10）：预览：,三、跨多行、多列的表项 1、跨多列表项 格式：表项 或 表项 或 表项 其中，x表示合并的列数。 2、跨多行表项 格式；表项 或 表项 或 表项 3、同时跨多列多行表项 格式： 其中，rowspan设置表头跨过x列，colspan表头跨过y行。 举例（5-11）预览：举例（5-12）：预览：,四、表格在页面中的属性 现把表格作为一个整体，介绍表格在页面中的位置及背景的设置。 1、设定表格在页面中的位置 格式： 说明：当表格位于页面的左侧或右侧时，文本填充在另一侧，当表格居中时，表格两边没有文本。当align属性缺省时，文本在
4、表格的下面。 举例（5-13）：预览： 2、表格的图像背景 由于表格能够更方便地安排文字、图片的位置，所以很多网面常用表格来制作。下面介绍用表格作为整个页面。在、标记中，使用下面属性： background=“图像文件名” 设置背景图像：,bordercolor=“颜色” 设定表格边框的颜色； Bordercolorlight=“颜色” 设定表格边框亮部的颜色； Rules=“row.cols或none” 设定表内线的显示方法 另外，还可以用标记中的bgcolor属性给表格的每个单元设置背景色； 题头 表尾 表体1,. 表体n 说明：可以定义多个表体部分，每个部分定义多行信息，每行的格式与一般
5、表格中的一样。在同一个中，所有各行的列数必须相同。、标记可以是单标记 。 在浏览器中显示时，表头、表尾以及各个表体之间都用边框分隔。 举例（5-16）：预览： 2、按列分组 格式： 说明：设置一个或多个列。 span的值x大于0，表示从左数起，指定属性的列组的列数，缺省为1列。Width的值y表示该列组各列的,宽度，可以为像素数、%或n*(自动分配，为当前列的1/n). 格式： 说明：设置一列的属性 span取0以上的值，用于指定所含列数，指本列及后续x-1列。Width的值是列的宽度，宽度属性值的取法同。 举例（5-17）：预览： 举例（5-18）：预览： 六、对齐表项 在缺省情况下，表项居于单元的左端。可以使用列、行的属性设置表项数据在单元格中的位置。 1、水平对齐 格式：,水平数据分为：表项数据的居中、左对齐、右对齐、左右调整、整列以特殊文字对齐。方式是用标记、和的align属性。 align的属性值分别为：（center、left、right、justify（左右调整） 举例（5-19）：预览： 2、 垂直对齐 Valign的属性值： top、bottom、middle、baseline(同单元数据项位置一致。 （ 垂直对齐）举例（5-20）：预览： （调整表格中数据的位置）举例 （5-21）：预览： （在表格中放置图像）举例（5-22）：预览：,