熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> Java編程 >> JSP教程 >> 正文

固定表格行列(expression)在IE下適用

2022-06-13   來源: JSP教程 
本文為大家介紹下使用expression固定表格行列這是一種在IE下適用的固定行列的方法感興趣的朋友可以學習下希望對大家有所幫助  

  這是一種在IE下適用的固定行列的方法其具體代碼如下:

復制代碼 代碼如下:

  
<!DOCTYPE HTML PUBLIC "//WC//DTD HTML Transitional//EN">
<html>
<head>
<title> New Document </title>
<style>
FixedTitleRow
{
position: relative;
top: expression(thisoffsetParentscrollTop);
zindex: ;
width: px;
backgroundcolor: #FFCC;
}
FixedDataColumn
{ position: relative;
left: expression(thisparentElementoffsetParentparentElementscrollLeft);
backgroundcolor: #EECF;
}
FixedColumnAndRows{
position: relative;
top: expression(thisoffsetParentscrollTop);
left: expression(thisoffsetParentscrollLeft);
zindex: ;
width: px;
backgroundcolor: #FFCC;
}
td{wordbreak : keepall;}
</style>
</head>
<body>
<div id="scrollDiv" style="width:; height:; overflow: auto; cursor: default; display: inline; position: absolute;">
<table width="%" cellpadding= cellspacing= bordercolor=lightgrey border="" style="tablelayout:fixed">
<tr bgcolor="#FFCC" style="fontsize:px; textalign:center; fontweight:bold;height:px;">
<td class="FixedColumnAndRows">header</td>
<td class="FixedColumnAndRows">header</td>
<td class="FixedColumnAndRows">header</td>
<td class="FixedTitleRow">header</td>
<td class="FixedTitleRow">header</td>
<td class="FixedTitleRow">header</td>
<td class="FixedTitleRow">header</td>
<td class="FixedTitleRow">header</td>
<td class="FixedTitleRow">header</td>
<td class="FixedTitleRow">header</td>
<td class="FixedTitleRow">header</td>
<td class="FixedTitleRow">header</td>
</tr>
<tr style="fontsize:px; textalign:center;height:px;">
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="fontsize:px; textalign:center;height:px;">
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="fontsize:px; textalign:center;height:px;">
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="fontsize:px; textalign:center;height:px;">
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="fontsize:px; textalign:center;height:px;">
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="fontsize:px; textalign:center;height:px;">
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="fontsize:px; textalign:center;height:px;">
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td class="FixedDataColumn">left</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
/* 這種固定行列的方式只適用於IE並且只適用於數據量較少的情況數據量很多時是非常耗資源的!*/


From:http://tw.wingwit.com/Article/program/Java/JSP/201311/20440.html
    推薦文章
    Copyright © 2005-2022 電腦知識網 Computer Knowledge   All rights reserved.