一直以来,我都找不到一个比较好的方法用来创建头部固定可滚动的表格,网上有的只是使用javascript或者使用两三层的table标签,来实现这个功能,这样做都不好,浪费资源。直到看到了这篇文章:
http://www.imaputz.com/uportal/index.php?p=18
里面有两个例子: The Big Four Version and The Bullet Resistant Version 它们很好的解决了这个功能,而且最大的好处是它们是纯CSS的。
不过美中不足的是它们不支持IE7,在我读懂了他们的代码后发现,因为IE也支持CSS选择器。所以原版里面用来区分IE和其他浏览器的方法,在IE7上面不起作用。需要为IE7单独做hack,文件里面所有*...!important都是为了匹配IE7。另外IE7下面,tr和td会继承tbody的height属性,所以需要为tr和td重置高度属性。所以我就修正它们的问题。我想之所以它们不支持IE7可能是作者写这个文档的时候IE7还没有面世的缘故吧。
附件里面有原件,和我修改过的,大家可以下载过来看看。
里面有两个例子: The Big Four Version and The Bullet Resistant Version 它们很好的解决了这个功能,而且最大的好处是它们是纯CSS的。
不过美中不足的是它们不支持IE7,在我读懂了他们的代码后发现,因为IE也支持CSS选择器。所以原版里面用来区分IE和其他浏览器的方法,在IE7上面不起作用。需要为IE7单独做hack,文件里面所有*...!important都是为了匹配IE7。另外IE7下面,tr和td会继承tbody的height属性,所以需要为tr和td重置高度属性。所以我就修正它们的问题。我想之所以它们不支持IE7可能是作者写这个文档的时候IE7还没有面世的缘故吧。
附件里面有原件,和我修改过的,大家可以下载过来看看。