表格介绍及页面布局.docVIP

表格 一、表格的基本功能： 1、创建数据表格。 2、进行网页布局。 二、表格的基础知识介绍 （1）构成表格的基本元素：table、tr、td (一)、table标签 属性 属性说明 值 值说明 举例 align 规定表格相对周围元素的对齐方式。 (不被赞成使用) Left/center/right 表格居左、居中、居右 border 规定表格(外)边框的宽度。 n (px) 关闭表格框线，相当于值为0 table 开启表格框线，相当于值为1px table border 值为0时，效果同无border属性 table border=”0” frame 规定外侧边框的哪个部分是可见的。 void 框线为无 above/below/lhs/rhs 有上/下/左/右框线 nsides/vsides 有上和下（水平方向）/左和右（垂直方向）框线 bordercolor 设置表格线颜色，在表格背景色基础上使用高色和暗色获得三效果。 边框颜色 rgb(x,x,x) #xxxxxx colorname 10进制的RGB颜色值 16进制的颜色值 参见颜色名表 bgcolor=”rgb(255,0,0)” bordercolorlight 边框亮色 bgcolor=”#ff0000” bordercolordark 边框暗色 bgcolor=”red” bgcolor 规定表格背景颜色。 (不被赞成使用) rgb(x,x,x) #xxxxxx colorname 略 略 background 规定表格背景图片。 URL 注意引用的图片相对路径。 background=”images/bg.jpg” width 规定表格的宽度。 n % n (px) 当设置百分比时，表格的大小随浏览器窗口大小的变化而自动适应。 width=70% width=700 height 规定表格的高度。 同width 同width。 cellspacing 控制表格中相邻单元格之间以及单元格和表格边框线之间的间距。 n (px) 当border开启时，默认为2px。 cellpadding 控制单元格的边框和它里面的内容之间的距离。 n (px) 默认为1px。 Rules 规定内侧边框的哪个部分是可见的。 none groups rows cols all summary 规定表格的摘要。 text 注：HTML 与 XHTML 之间的差异：在 HTML 4.01 中，table 元素的 align 和 bgcolor 属性是不被赞成使用的。在 XHTML 1.0 Strict DTD，table 元素的 align 和 bgcolor 属性是不被支持的。 标准属性: id, class, title, style, dir, lang, xml:lang 事件属性: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup  表格边框及单元格框线宽度计算： 1、表格组成： 表格由外边框（border）和单元格组成。如右图： 2、表格的两种边框线： （1）外边框线 border：可能通过设置一个整数值来调整其线宽。 （2）单元格框线：是一个像素（pix）的线宽。 3、框线区域占的宽度的计算： （1外框区域占的宽度 = ① border +② 单元格框线（1px）+③ cellspacing （2单线格框线区域占的宽度=② 单元格框线（1px）+③ cellspacing +② 单元格框线（1px） 几种情况： A、当无border属性或border=”0”，且无cellspacing时，浏览器为外框区域和所有单元格框线区留2px的宽度； B、当有border属性或border=”1”，且无cellspacing时，框线间增加2个像素（相当于cellspacing=”2”），即外框区域和所有单元格框线区的宽度为1+2+1=4px； 4、当表格的宽度或高度被固定后，改变border或cellspacing或cellpadding时，表格宽度或高度不会改变，但单元格内的内容区域大小会改变。 当表格的宽度或高度没有被设定（即为自动）时，改变border或cellspacing或cellpadding时，表格宽度或高度会被改变，但单元格内的内容区域大小不会改变。 （二）、行标签tr 可选的属性 DTD 指示此属性允许在哪种 DTD 中使用。S=Stri