`
yuanlijia1
  • 浏览: 114065 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

仿EXCEL标题上下浮动

    博客分类：
  • js
Excel 
阅读更多
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style type="text/css">
<!--
/*重点：固定行头样式*/
.scrollRowThead
{
     position: relative;
     left: expression(this.parentElement.parentElement.parentElement.parentElement.scrollLeft);
     z-index:0;
}
.scrollRowTbody
{
     position: relative;
     left: expression(this.parentElement.parentElement.parentElement.parentElement.scrollLeft);
     z-index:0;
}

/*重点：固定表头样式*/
.scrollColThead {
     position: relative;
     top: expression(this.parentElement.parentElement.parentElement.scrollTop);
     z-index:2;
}
.scrollColTbody {
     position: relative;
     top: expression(this.parentElement.parentElement.parentElement.scrollTop);
     z-index:2;
}


/*行列交叉的地方*/
.scrollCR {
     z-index:3;
}

/*div外框*/
.scrollDiv {
height : 0px;
clear: both;
border: 1px solid #EEEEEE;
OVERFLOW: scroll;
width: 100%;
}

/*行头居中*/
.scrollColThead td,.scrollColThead th
{
text-align: center ;
}

/*行头列头背景*/
.scrollRowThead,.scrollColThead td,.scrollColThead th
{
font-size:12px;
font-weight:bold;
text-align:center;
}

/*表体固定*/
.scrollRowTbody,.scrollColTbody td,.scrollColTbody th
{
font-size:12px;
text-align:center;
}
-->
</style>
<STYLE type=text/css>
#s {
font-size: 9pt;
width:200px;
background-color:FFFFFF;
height:200px;
position:absolute;
display:none;
overflow-y:scroll;
scrollbar-base-color: Blue;
scrollbar-face-color: CornflowerBlue;
scrollbar-track-color: AliceBlue;
scrollbar-arrow-color: AliceBlue;
scrollbar-3dlight-color: Azure;
scrollbar-darkshadow-color: AntiqueWhite;
scrollbar-highlight-color: Beige;
scrollbar-shadow-color: Cornsilk;
background:#cce6ff;
padding: 5px;
overflow: auto;
text-align: left;

font-family:Tahoma, Verdana, SansSerif;
font-size:11PX;

}
</STYLE>
</HEAD>

<BODY topmargin="0" leftmargin="0">
<table width="600" height="800" border="0" align="center" cellPadding="0" cellspacing="1" bgcolor="">

  <tr class="scrollColThead scrollCRs"> 
<td height="25" colspan="20" align="center" class="biaoti2"  bgcolor="lightblue" style="border:1px solid gray;"><b>AAAAAAAAA</b>
</td>
  </tr>
  <tr height="25" class="scrollColThead scrollCRs">
  <!--
<td height="25" rowspan="" width="120"  bgcolor="lightblue" class="scrollRowThead scrollCR scrollColThead" style="border:1px solid gray;">使用部门</td>
-->
<td align="center"  bgcolor="lightblue" class="scrollRowThead scrollCR scrollColThead" style="border:1px solid gray;">标题</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题2</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题3</td>
    <td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题4</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题5</td>
    <td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题6</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题7</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题8</td>
    <td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题9</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题10</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题1</td>
    <td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题2</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题3</td>
    <td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题4</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题5</td>
    <td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题6</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题7</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题8</td>
    <td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题9</td>
<td align="center"  bgcolor="lightblue" class="biaoti2" style="border:1px solid gray;">标题10</td>
  </tr>

<tr id="tr1">
  <!--
  <td height="25" align="center" width="120"  bgcolor="lightblue" class="scrollRowThead scrollCR" style="border:1px solid gray;">adf<font color="#ffffff;"></font></td>
  -->
  <td align="center"  height="25" bgcolor="lightblue" class="scrollRowThead " style="border:1px solid gray;"><b>sdfdf</b></td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  <td align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">sdfsdf</td>
  </tr>

<tr>
  <td align="center"  bgcolor="lightblue" class="scrollRowThead" style="border:1px solid gray;"><b> 123</b></td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
</tr>

<tr>
  <td height="25" align="center"  bgcolor="lightblue" class="scrollRowThead" style="border:1px solid gray;"><b> vasdasd</b></td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
</tr>

<tr>
  <td height="25" align="center"  bgcolor="lightblue" class="scrollRowThead" style="border:1px solid gray;"><b> qwqw</b></td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">123</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
  <td height="25" align="center"  bgcolor="" class="biaoti2" style="border:1px solid gray;">333</td>
</tr>


<tr></tr>

</table>
</BODY>
</HTML>
分享到：
| 当前时实时间显示
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics