文档章节

html固定第一列第一行 其他可以滚动

zvc888
 zvc888
发布于 2014/12/12 13:18
字数 1653
阅读 49
收藏 0
<!DOCTYPE html>
<html>


  <head>
    <meta charset="utf-8" />
    <title></title>
    <link rel="stylesheet" href="style.css" />
    <script data-require="jquery" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
    <script src="script.js"></script>
  </head>


  <body style=" font-size:12px;">
    
    <div id="table-container">
      <div class="table-lt">
        <table>
          <tbody>
            <tr>
              <td>
                <div>
                  文号
                </div>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="table-top">
        <div class="table-mask" >
          <table>
            <tbody>
              <tr>
                <td>
                  <div>日期</div>
                </td>
                <td>
                  <div>单位</div>
                </td>
                <td>
                  <div>业务员</div>
                </td>
                <td>
                  <div>部门</div>
                </td>
                <td>
                  <div>验资类型</div>
                </td>
                <td>
                  <div>资产原值(增资)</div>
                </td>
                <td>
                  <div>增资额度(增资)</div>
                </td><td>
                  <div>验资额度(普通)</div>
                </td><td>
                  <div>备注</div>
                </td>
               
                <s:if test="#session.sessionInfo.identityId!=3">
                  <td>
                  <div>一审</div>
                </td>
                <td>
                  <div>二审</div>
                </td>
                <td>
                  <div>三审</div>
                </td>
        </s:if>
             <td>
                  <div>盖章</div>
                </td>
                <td>
                  <div>财务</div>
                </td>
                <td>
                  <div>归档</div>
                </td>
                <td>
                  <div>基本操作</div>
                </td>
   

     
              </tr>
            </tbody>
          </table>
        </div>
      </div>
      <div class="table-left">
        <div class="table-mask">
          <table>
            <tbody>
              <tr>
                <td >
                  <div>leftTitle1</div>
                </td>
              </tr>
              <tr>
                <td>
                  <div>leftTitle2</div>
                </td>
              </tr>
              <tr>
                <td>
                  <div>leftTitle3</div>
                </td>
              </tr>
              <tr>
                <td>
                  <div>leftTitle4</div>
                </td>
              </tr>
              <tr>
                <td>
                  <div>leftTitle5</div>
                </td>
              </tr>
              <tr>
                <td>
                  <div>leftTitle6</div>
                </td>
              </tr>
              <tr>
                <td>
                  <div>leftTitle7</div>
                </td>
              </tr>
              <tr>
                <td>
                  <div>leftTitle8</div>
                </td>
              </tr>
                 <tr>
                <td>
                  <div>leftTitle8</div>
                </td>
              </tr>
                 <tr>
                <td>
                  <div>leftTitle8</div>
                </td>
              </tr>   <tr>
                <td>
                  <div>leftTitle8</div>
                </td>
              </tr>   <tr>
                <td>
                  <div>leftTitle8</div>
                </td>
              </tr>   <tr>
                <td>
                  <div>leftTitle8</div>
                </td>
              </tr>   <tr>
                <td>
                  <div>leftTitle8</div>
                </td>
              </tr>   <tr>
                <td>
                  <div>leftTitle8</div>
                </td>
              </tr>   <tr>
                <td>
                  <div>leftTitle8</div>
                </td>
              </tr>  
            </tbody>
          </table>
        </div>
      </div>
      <div class="table-right">
        <table>
          <tbody>
            <tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr>
           <tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr>
        <tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr><tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr><tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr>
          <tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr><tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr><tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr>
           <tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr>
          <tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr><tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr><tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr><tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr>
          <tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr><tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr><tr>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
              <td>
                <div>uoiuiufdsfsdfiouiou</div>
              </td>
              <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
               <td>
                <div>123456789123456789</div>
              </td>
              
            </tr>
          </tbody>
        </table>
      </div>


    </div>
    
  </body>


</html>



原创

本文转载自:http://blog.csdn.net/vc_super/article/details/23947809

zvc888
粉丝 5
博文 107
码字总数 17062
作品 0
深圳
程序员
私信 提问
CSS定位布局相关

本文档包括CSS的 样式 定位 框模型 如果文档比较长,那么当文档向下滚动时,背景图像也会随之滚动。当文档滚动到超过图像的位置时,图像就会消失。 您可以通过 background-attachment 属性防...

二两豆腐
2015/11/24
41
0
Delphi StringGrid常用属性和常用操作

StringGrid组件用于建立显示字符串的网格,与电子表格相似。它可使表格中的字符串和相关对象操作简单化。StringGrid组件提供了许多可控制网格外观念的属性,以及利用表格的结构响应用户操作的...

dillonxiao
2018/05/11
35
0
首列固定的列表

实现特殊的表格(UITableView)效果:即表格中的首列固定不动,而每一行除了首列均可左右拖动,以展现每一行更多内容。 作者谭林江(@无法越狱的痛)说:去益盟面试回来,感觉聊得有点郁闷,...

匿名
2013/01/24
1K
0
如何用JXL或POI改变excel中数据

有什么方法可以让一个excel表格中某些字段,改变排列顺序;比如:第三列为项目名称,现在我要求它排在第一列,也就是说现在它排在第一列.注意:我所使用的excel表格的表头都是冷数据,是固定不会更改...

今天不高兴
2016/08/04
172
1
前端常用功能记录(三)—datatables表格初始化

其实上篇说的也算是jQuery Datatables的初始化,但主要是对某些字段意义的理解。下面记录的是datatables常用的功能的初始化。 数据源 我经常使用的有两种,一种是JavaScript 中的数组,通过在...

zhoujie0111
2015/03/02
0
0

没有更多内容

加载失败,请刷新页面

加载更多

java通过ServerSocket与Socket实现通信

首先说一下ServerSocket与Socket. 1.ServerSocket ServerSocket是用来监听客户端Socket连接的类,如果没有连接会一直处于等待状态. ServetSocket有三个构造方法: (1) ServerSocket(int port);...

Blueeeeeee
今天
6
0
用 Sphinx 搭建博客时,如何自定义插件?

之前有不少同学看过我的个人博客(http://python-online.cn),也根据我写的教程完成了自己个人站点的搭建。 点此:使用 Python 30分钟 教你快速搭建一个博客 为防有的同学不清楚 Sphinx ,这...

王炳明
昨天
5
0
黑客之道-40本书籍助你快速入门黑客技术免费下载

场景 黑客是一个中文词语,皆源自英文hacker,随着灰鸽子的出现,灰鸽子成为了很多假借黑客名义控制他人电脑的黑客技术,于是出现了“骇客”与"黑客"分家。2012年电影频道节目中心出品的电影...

badaoliumang
昨天
15
0
很遗憾,没有一篇文章能讲清楚线程的生命周期!

(手机横屏看源码更方便) 注:java源码分析部分如无特殊说明均基于 java8 版本。 简介 大家都知道线程是有生命周期,但是彤哥可以认真负责地告诉你网上几乎没有一篇文章讲得是完全正确的。 ...

彤哥读源码
昨天
15
0
jquery--DOM操作基础

本文转载于:专业的前端网站➭jquery--DOM操作基础 元素的访问 元素属性操作 获取:attr(name);$("#my").attr("src"); 设置:attr(name,value);$("#myImg").attr("src","images/1.jpg"); ......

前端老手
昨天
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部