友情链接:联系人：QQ2014年2月 .NET技术大版内专家分月排行榜第二
2014年4月 .NET技术大版内专家分月排行榜第三2014年3月 .NET技术大版内专家分月排行榜第三2013年10月 .NET技术大版内专家分月排行榜第三
2014年2月 .NET技术大版内专家分月排行榜第二
2014年4月 .NET技术大版内专家分月排行榜第三2014年3月 .NET技术大版内专家分月排行榜第三2013年10月 .NET技术大版内专家分月排行榜第三
匿名用户不能发表回复！|
每天回帖即可获得10分可用分！小技巧：
你还可以输入10000个字符
(Ctrl+Enter)
请遵守CSDN，不得违反国家法律法规。
转载文章请注明出自“CSDN（www.csdn.net）”。如是商业用途请联系原作者。&table&的属性和使用
1.什么是表格&表格的作用什么是表格：由一些 被称之为 单元格的矩形框 按照从左到右从上到下的顺序排列到一起组成的表格的作用：以一定的结构来显示信息的。&2.如何使用表格定义表格：&table&&/table&创建表行：&tr&&/tr&创建列(单元格):&td&&/td&&注意：默认情况下，每行中的列数是统一的。table : display:特点：1、独占一行2、宽度自适应(由内容来决定)&3、表格属性&&&&&&&&&&&&&& 1、&table& 属性&&&&&&&&&&&&&&&&&&& 1、width&&&&&&&&&&&&&&&&&&&&&&&& 设置表格宽度&&&&&&&&&&&&&&&&&&& 2、height&&&&&&&&&&&&&&&&&&&&&&&& 设置表格高度&&&&&&&&&&&&&&&&&&& 3、align&&&&&&&&&&&&&&&&&&&&&&&& 设置 表格 在其 父元素中的水平对齐方式，取值：left,center,right&&&&&&&&&&&&&&&&&&& 4、border&&&&&&&&&&&&&&&&&&&&&&&& 边框,边框宽度，以px为单位的数值，px可以省略&&&&&&&&&&&&&&&&&&& 5、cellpadding&&&&&&&&&&&&&&&&&&&&&&&& 单元格内边距&&&&&&&&&&&&&&&&&&&&&&&& 单元格边框与内容之间的距离&&&&&&&&&&&&&&&&&&& 6、cellspacing&&&&&&&&&&&&&&&&&&&&&&&& 单元格外边距&&&&&&&&&&&&&&&&&&&&&&&& 单元格与单元格之间或者单元格与表格之间的 距离&&&&&&&&&&&&&&&&&&& 7、bgcolor&&&&&&&&&&&&&&&&&&&&&&&& 背景颜色&&&&&&&&&&&&&& 2、&tr& 属性&&&&&&&&&&&&&&&&&&& 1、align&&&&&&&&&&&&&&&&&&&&&&&& 该行的内容 水平对齐方式&&&&&&&&&&&&&&&&&&& 2、valign&&&&&&&&&&&&&&&&&&&&&&&& 该行的内容 垂直对齐方式&&&&&&&&&&&&&&&&&&&&&&&& 取值：top，middle，bottom&&&&&&&&&&&&&&&&&&& 3、bgcolor&&&&&&&&&&&&&& 3、&td& 属性&&&&&&&&&&&&&&&&&&& 1、width&&&&&&&&&&&&&&&&&&& 2、height&&&&&&&&&&&&&&&&&&& 3、align&&&&&&&&&&&&&&&&&&& 4、valign&&&&&&&&&&&&&&&&&&& 5、bgcolor&&&&&&&&&&&&&&&&&&& 6、colspan&&&&&&&&&&&&&&&&&&&&&&&& 设置单元格跨列&&&&&&&&&&&&&&&&&&& 7、rowspan&&&&&&&&&&&&&&&&&&&&&&&& 设置单元格跨行&&&&&&&&& 3、表格中的其他标记&&&&&&&&&&&&&& 1、&caption&&/caption&&&&&&&&&&&&&&&&&&&& 作用：为表格定义标题&&&&&&&&&&&&&&&&&&& 位置：表格正上方居中显示&&&&&&&&&&&&&&&&&&& &table&&&&&&&&&&&&&&&&&&&&&&&&& &caption&标题&/caption&&&&&&&&&&&&&&&&&&&&&&&&& &tr&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&/td&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&/td&&&&&&&&&&&&&&&&&&&&&&&&& &/tr&&&&&&&&&&&&&&&&&&&& &/table&&&&&&&&&&&&&&& 2、行标题或列标题&&&&&&&&&&&&&&&&&&& 列标题：第一行中的每一列，加粗，水平居中的效果显示&&&&&&&&&&&&&&&&&&& 行标题：每行里面的第一列, 加粗，水平居中的效果显示&&&&&&&&&&&&&&&&&&& 行(列)标题:&th&&/th&&&&&&&&&&&&&&&&&&&& &th&&/th&作用 与 &td&&/td&一模一样&&&& 3、表格的复杂应用&&&&&&&&& 1、行分组&&&&&&&&&&&&&& 表格可以被划分成3个部分&&&&&&&&&&&&&& 1、表头 &thead&&/thead&&&&&&&&&&&&&&& 2、表主体 &tbody&&/tbody&&&&&&&&&&&&&&& 3、表尾&&&& &tfoot&&/tfoot&&&&&&&&&&&&&&& &table&&&&&&&&&&&&&&&&&&&& &tbody&&&&&&&&&&&&&&&&&&&&&&&&& &tr&&/tr&&&&&&&&&&&&&&&&&&&&&&&&& &tr&&/tr&&&&&&&&&&&&&&&&&&&& &/tbody&&&&&&&&&&&&&&& &/table&&&&&&&&&&&&&&& 注意：如果不对表格行进行分组的话，那么默认都属于 tbody 中&&&&&&&&& 2、不规则表格&&&&&&&&&&&&&& 每行中的列数，不是统一化的。&&&&&&&&&&&&&& 1、跨列&&&&&&&&&&&&&&&&&&& 合并列，让指定的单元格，横向向右，合并几个单元格(包含自己)&&&&&&&&&&&&&&&&&&& 语法：&&&&&&&&&&&&&&&&&&&&&&&& td 的 colspan 属性&&&&&&&&&&&&&& 2、跨行&&&&&&&&&&&&&&&&&&& 合并行，让指定的单元格，纵向向下，合并几个单元格(包含自己)&&&&&&&&&&&&&&&&&&& 语法：&&&&&&&&&&&&&&&&&&&&&&&& td 的 rowspan 属性&&&&&&&&&&&&&& 注意：无论是跨行还是跨列，被合并的单元格一定从代码中删除出去&&&&&&&&& 3、表格的嵌套&&&&&&&&&&&&&& 在一个表格中，又嵌入了另外一个表格&&&&&&&&&&&&&& 被嵌套的表格必须出现在&td&中&&&&&&&&&&&&&& &table&&&&&&&&&&&&&&&&&&&& &tr&&&&&&&&&&&&&&&&&&&&&&&&& &td&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &table&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &/td&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &/tr&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &/table&&&&&&&&&&&&&&&&&&&&&&&&& &/td&&&&&&&&&&&&&&&&&&&& &/tr&&&&&&&&&&&&&&& &/table&&4.表格特有的样式属性1、边框合并&&&&&&&&&&&&&& 属性：border-collapse&&&&&&&&&&&&&& 取值：&&&&&&&&&&&&&&&&&&& 1、separate&&&&&&&&&&&&&&&&&&&&&&&& 默认值，分离边框模式&&&&&&&&&&&&&&&&&&& 2、collapse&&&&&&&&&&&&&&&&&&&&&&&& 边框合并模式2、边框边距&&&&&&&&&&&&&& 1、作用&&&&&&&&&&&&&&&&&&& 设置相邻单元格边框之间的距离(类似于cellspacing)&&&&&&&&&&&&&& 2、属性&&&&&&&&&&&&&&&&&&& border-spacing&&&&&&&&&&&&&&&&&&& 取值：&&&&&&&&&&&&&&&&&&&&&&&& 1、取1个值&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 表示水平和垂直间距相等&&&&&&&&&&&&&&&&&&&&&&&& 2、取2个值&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 第一个值表示的 水平间距&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 第二个值表示的 垂直间距&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 两个值之间用 空格 隔开&&&&&&&&&&&&&& 3、要求&&&&&&&&&&&&&&&&&&& border-collapse必须为separate&&&&&&&&&&&&&&&&&&& 必须为分离边框模式时有效3、标题位置&&&&&&&&&&&&&& &caption&&/caption&&&&&&&&&&&&&&& 作用：将标题位置由默认的位置改到表格之下&&&&&&&&&&&&&& 属性：caption-side&&&&&&&&&&&&&& 取值：&&&&&&&&&&&&&&&&&&& 1、top&&&&&&&&&&&&&&&&&&&&&&&& 默认&&&&&&&&&&&&&&&&&&& 2、bottom&&&&&&&&&&&&&&&&&&&&&&&& 标题位于表格之下4、显示规则&&&&&&&&&&&&&& 1、作用&&&&&&&&&&&&&&&&&&& 指定浏览器以什么样的方式来布局一个表格。实际是指定了单元格的算法规则&&&&&&&&&&&&&&&&&&& 默认算法：单元格的宽由内容来决定，不受设置的width值来限定。&&&&&&&&&&&&&& 2、属性&&&&&&&&&&&&&&&&&&& table-layout&&&&&&&&&&&&&&&&&&& 取值：&&&&&&&&&&&&&&&&&&&&&&&& 1、auto&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 默认值，自动，列宽由内容来决定&&&&&&&&&&&&&&&&&&&&&&&& 2、fixed&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 固定表格布局，列宽由设定的值决定。&&&&&&&&&&&&&& 3、自动表格布局&固定表格布局&&&&&&&&&&&&&&&&&&& 1、自动表格布局(auto)&&&&&&&&&&&&&&&&&&&&&&&& 单元格的大小会适应内容大小&&&&&&&&&&&&&&&&&&&&&&&& 在表格复杂时，加载会比较慢&&&&&&&&&&&&&&&&&&&&&&&& 适用于不确定每列大小时使用&&&&&&&&&&&&&&&&&&&&&&&& 传统表格表现方式&&&&&&&&&&&&&&&&&&& 2、固定表格布局(fixed)&&&&&&&&&&&&&&&&&&&&&&&& 单元格的大小由设定的值来决定，与内容无关&&&&&&&&&&&&&&&&&&&&&&&& 会加速显示表格，浏览器在加载完第一行的时候就不用再计算了。&4、隐藏的显示效果属性： &visibility:collapse用在表格元素上，删除一行或一列，不影响表格整个布局
最新教程周点击榜
微信扫一扫