html表格冻结原理,html表格table冻结行和列

转自http://liyinlei.iteye.com/blog/2077714

这种固定行列的方式只适用于IE,并且只适用于数据量较少的情况.数据量很多时是非常耗资源的

完美冻结列和行

.FixedHeaderColumnsTableDiv

{

overflow: auto;

position: relative;

}

.FixedCell

{

position: relative;

top: expression(this.offsetParent.scrollTop);

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

z-index: 1800;

}

.FixedHeaderRow1

{

position: relative;

top: expression(this.offsetParent.scrollTop);

background-color: #ccc;

z-index: 300;

}

.FixedHeaderRow2

{

position: relative;

top: expression(this.offsetParent.scrollTop);

z-index: 290;

background-color:#ffccff;

}

.FixedDataColumn

{

position: relative;

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

z-index: 200;

background-color: Aqua;

}

header1	header2	header3	header4	header5	header6	header7	header8	header9	header10
ss	ss	header16	header17dddddddddddd
col1	col2	col3	col4	col5	col6	col7	col8	col9	col10
col1	col2	col3	col4	col5	col6	col7	col8	col9	col10
col1	col2	col3	col4	col5	col6	col7	col8	col9	col10
col1	col2	col3	col4	col5	col6	col7	col8	col9	col10
col1	col2	col3	col4	col5	col6	col7	col8	col9	col10
col1	col2	col3	col4	col5	col6	col7	col8	col9	col10
col1	col2	col3	col4	col5	col6	col7	col8	col9	col10