您的位置：首页 > Web前端 > CSS

css固定表格titile和首列的实现

2007-06-26 17:55 387 查看

经过几天的学习，稍微了解了些div+css的网站布局的思路和好处。
本来是confuseLing给我发来了一段代码，实现了锁定title和first col的css，但是在用户体验上并不好，我整理了一下。言归正传，直接说这个的实现。

test.css:

.firstRow {...}{

background-color:#CC9900;

top:expression(this.offsetParent.scrollTop);

z-index:10;

position:relative;

}

.corner {...}{

background-color:#CC9900;

z-index:10;

left:expression(this.parentElement.offsetParent.scrollLeft);

top:expression(this.offsetParent.scrollTop);

position:relative;

}

.firstCol {...}{

background-color:white;

z-index:10;

left:expression(this.parentElement.offsetParent.scrollLeft);

position:relative;

}

.relative{...}{

position:relative;

}

div {...}{

overflow:auto;

width:300px;

height:150px;

}

tr {...}{height:50px;}

test.html:

<html>

<head>

</head>

<body>

<div>

</tr>

</tr>

</tr>

</tr>

</table>

</div>

</body>

</html>

这个的用户体验并不好，尤其是scroll之后，画面的边缘有略微的毛边，是不是可以把table border干掉，然后每个cell 设置 cell border，可以解决这个问题，今天我是没有空来探讨啦。

另外这个css的expression并不支持最新的css2.0和html4.0标准。虽然最新的ie支持但是加上了w3c的标准后，程序像预想一样正常运行。

这里介绍一个软件：

TopStyle Pro 3.0 可以检测css是否符合w3c的web 2.0标准。
至少因为使用了expression。上述代码无法通过web 2.0的：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">标准

TopStyle Pro 3.0 试用期注册表破解字段为：
HKU/S-1-5-21-1177238915-1580818891-1060284298-500/Software/Microsoft/Windows/CurrentVersion/WinSHTrack

是论日算的，从那天起不知道，但是你给它加1000天，就慢慢使用吧。
使用RegShot 监测的c:/和注册标的变化查到的这个字段，虽然还是很讨厌的会弹出试用框，但是毕竟可以长期使用了。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航