表格表头固定,内容多时滚动内容
不多写废话了,都在代码注释中
<html><head><style type="text/css">* {margin: 0;padding: 0;}/*所有内容都在这个DIV内*/.all {width: 100%;border: 1px solid #000000;}/*表头在这个DIV内*/.title {width: 500px; /*这个宽度需要与下面的内容的DIV相等*/}/*表格样式*/table {width: 100%; /*撑满上面定义的500像素*/border: 1px solid #FF00FF;border-collapse: collapse; /*边线与旁边的合并*/table-layout:fixed;}/*表头单元格(这里将表头单元格的样式设置成了和单元格一样,实际中可以改变)*/table tr th {border: 1px solid #FF00FF;overflow: hidden; /*超出长度的内容不显示*//*word-wrap: break-word; 内容将在边界内换行,这里显示省略号,所以不需要了*/word-break: break-all; /*字内断开*/text-overflow: ellipsis; /*当对象内文本溢出时显示省略标记(…),省略标记插入的位置是最后一个字符*/white-space: nowrap;}/*单元格样式*/table tr td {border: 1px solid #FF00FF;overflow: hidden;/*word-wrap: break-word; 内容将在边界内换行,这里显示省略号,所以不需要了*/word-break: break-all;text-overflow: ellipsis;white-space: nowrap;}/*容纳表格内容的DIV,这个DIV上放置滚动条*/.content {width: 100%;height: 100px; /*定一下高度,要不然就撑出来没滚动条了*/overflow: scroll; /*总是显示滚动条*/}/*真正存放内容的DIV*/.content div {width: 500px; /*与表头的DIV宽度相同*/}</style></head><body><div />
/*容纳表格内容的DIV,这个DIV上放置滚动条*/ .content { width: 515px; height: 100px; /*定一下高度,要不然就撑出来没滚动条了*/ overflow: scroll; /*总是显示滚动条*/ overflow-x: hidden; } 13 楼 竹隐江南 2011-05-12 不搞前端,web涉及,不过看了楼主想法应该和我差不多,用了两个div。额额收藏下这合乎 14 楼 wqmain 2011-05-13 jquery flexigrid