模块二网页排版技术 单元5：表格技术的应用 一、简单表格挂版网页效果预览 边亚：首因 工作复1联华1厚度1眼期引情每深【天干家人1联车1 中 ·工作建的情基 框人类文 。型含上的内顶时有 球十单量存 ,0金相毛U设 湖西数活 ,香组建据日记其定 一新家南 ,疑明味理 位球果 ·车人介得天于瑞铜 :的按量家出的有浮 情电L8H8言 某KmM=ogn1某长O9-421141量新-420C1本站9月家为000×6 图2-5-】简单表格排版网页效果图打开示侧网页 绝大多数的网页都是使用表格排版布局，他比较规范。开始学DW 的，都比较喜欢用图层排版，其主要原因是图层可以把对象放到你想放 的任意位置，并且只需拖动鼠标，看起米非常轻松，但用F12预览就面 目全非。层的定位方式与表格的不同，层采取的定位方式是动态定位方 式，它的定位靠的是两个参数Lt和Top,这两个参数设置层框架与测 览器的边框的的距离，无论你是在最大化，还是在不同的分辨率下他都 始终在一个位置，而表格在不同的情况下它将有所变化。 二、实例制作步骤：
模块二 网页排版技术 单元 5：表格技术的应用 一、简单表格排版网页效果预览 图 2-5-1 简单表格排版网页效果图 打开示例网页 绝大多数的网页都是使用表格排版布局，他比较规范。开始学 DW 的，都比较喜欢用图层排版，其主要原因是图层可以把对象放到你想放 的任意位置，并且只需拖动鼠标，看起来非常轻松，但用 F12 预览就面 目全非。层的定位方式与表格的不同，层采取的定位方式是动态定位方 式，它的定位靠的是两个参数 Left 和 Top，这两个参数设置层框架与浏 览器的边框的的距离，无论你是在最大化，还是在不同的分辨率下他都 始终在一个位置，而表格在不同的情况下它将有所变化。 二、实例制作步骤：
1.首先插入4行1列的大表格，表格宽位778x,全途表格在属性面 板中设置对其方式为居中对齐”，填充，间距，边框都为0。将光标定 位于第1行在属性面板中设置背景颜色为#666666 行（■奥前■金素，欢1刀对*W日防，病无 列0： 风的达相0们年 0 2在第2行插入嵌套表格。参数设置如下图。第2行作为网页的导 航栏，并且输入导航文字。 行0 填究到02对南四以。为口无 口3 间开的0边E)0 0回 3.在第3行插入嵌套表格。参数设置如下图。 行01■ 夏的00■参君。博抗16■对算四可 的无 到95 风器间0达000 00 4.在第3行的第2列插入表格。参数设置如下图。输入正文文字， 行07 费■年可第充的■对济W认可共0无可 列1 颜0■边相000 0 5在第3行第4列插入表格，参数设置如下图。输入正文文字
1.首先插入 4 行 1 列的大表格，表格宽位 778px,全选表格在属性面 板中设置对其方式为“居中对齐”，填充，间距，边框都为 0。将光标定 位于第 1 行在属性面板中设置背景颜色为＃666666 。 2.在第 2 行插入嵌套表格。参数设置如下图。第 2 行作为网页的导 航栏，并且输入导航文字。 3.在第 3 行插入嵌套表格。参数设置如下图。 4.在第 3 行的第 2 列插入表格。参数设置如下图。输入正文文字。 5.在第 3 行第 4 列插入表格，参数设置如下图。输入正文文字
特的”■周的0■老习我m■对林川触认一东无 判91 间是的0也0010 世行装■ 0。 6第5行输入版权或者作者等信息。 三、本例表格的html语法结构分析 切换到代码视图模式。观察页面中的超级链接语法格式。 1表格的属性： 2.单元格的背景颜色： 3.单元格内容的对齐方式 您的位置：首页 四、建立表格的html语法总结 1建立表格由四对标记组成： table>定义表格元素 1>定义表格的一行 定义表格的表头单元格
6.第 5 行输入版权或者作者等信息。 三、本例表格的 html 语法结构分析 切换到代码视图模式。观察页面中的超级链接语法格式。 1.表格的属性： 2.单元格的背景颜色： 3.单元格内容的对齐方式 您的位置：首页 四、建立表格的 html 语法总结 1.建立表格由四对标记组成： 定义表格元素 定义表格的一行 定义表格的表头单元格
第一行第一列单元格内容第一行第二列单元格内容. 第一行第N列单元格内容 第二行第一列单元格内容 d心第二行第二列单元格内容 /table> 表格如果没有表头单元格，此处的h>可以由1心代替。 2.表格尺寸、背景 表格尺寸：table width=数值height=数值> 背景顾色：4 able bgcolor=颜色>
定义表格的单元格 表格的基本语法结构： 第一行第一列单元格内容 第一行第二列单元格内容 …… 第一行第 N 列单元格内容 第二行第一列单元格内容 第二行第二列单元格内容 …… 第二行第 N 列单元格内容 表格如果没有表头单元格，此处的可以由代替。 2.表格尺寸、背景 表格尺寸： 背景颜色：
背景图片：table background-URL> 3.表格间距 表格间距：q4 able cellspacing-数值 4.表格边距 表格边距：table cellpadding=数值> 5.表格标题 表格标题：表格标圈 6行高与布局 ：设置表格内某行的高度 tr align=参数值>：该行中单元格的水平对齐方式(lefi,center.right) ：该行中单元格的垂直对齐方式(top,middle,bottom) 7.行边框与背景 某行内边框的颜色：tr bordercolo=颜色值≥ 某行背景颜色：1 bgeolo=颜色值> 8列宽与布局
背景图片： 3.表格间距 表格间距： 4.表格边距 表格边距： 5.表格标题 表格标题：表格标题 6.行高与布局 ：设置表格内某行的高度 ：该行中单元格的水平对齐方式（left,center,right） ：该行中单元格的垂直对齐方式(top,middle,bottom) 7.行边框与背景 某行内边框的颜色： 某行背景颜色： 8.列宽与布局
表格列宽：d width=数值>orcth width=数值> 水平对齐：4 d align=参数值or4 h align=参数值≥ 垂直对齐：or 9.单元格边框与背景 单元格边框颜色：ctd bordercolor=颜色值>or 单元格背景颜色：or 单元格背景图片：th background=URL>or 10.跨行列属性 单元格跨行：oror 【课后小结】 在使用表格中应注意那些问题？ 1.整个表格不要都套在一个表格里，尽量拆分成多个表格。 2.表格的嵌套层次尽量要少，最好嵌套表格不超过3层。 3.单一表格的结构尽量整齐
表格列宽：or 水平对齐：or 垂直对齐: or 9.单元格边框与背景 单元格边框颜色: or 单元格背景颜色:or 单元格背景图片:or 10.跨行列属性 单元格跨行：or 单元格跨列：or 【课后小结】 在使用表格中应注意那些问题？ 1.整个表格不要都套在一个表格里，尽量拆分成多个表格。 2.表格的嵌套层次尽量要少，最好嵌套表格不超过 3 层。 3.单一表格的结构尽量整齐