zoukankan      html  css  js  c++  java
  • 固定表头简单实现

    <style>
    Table
    {
     border:none;
     100%;
     border-collapse:collapse;
    }

    Td
    {
     border:solid 1px #ccc;
     background-color:White ;
     padding:4px;
     font-size:13px;
    }
    Th
    {
     border:solid 1px #ccc;
     background-color:gray ;
     padding:4px;
     font-size:13px;
            Auto;
     
    }
    </style>

    <div style="height: 150px; overflow: auto;">
    <table border=0>
        <tr  style="background-color:gray;border-bottom:solid 1px blue;position:relative;top:expression(this.offsetParent.scrollTop);">
             <th>
                head
            </th>
     <th>1</th>
        </tr>   
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    </table>
    </div>

    firefox:
    <div style="height: 150px; overflow: auto;">
    <table border=1>
        <tr  style="position:fixed;background-color:gray;">
            <th>
                head
            </th>
     <th>1</th>
        </tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>   
     <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr><td>1</td><td>2</td></tr>
    </table>
    </div>

    作者:houfeng
    出处:http://houfeng.cnblogs.com
    本文版权归作者和博客园共有,未经作者同意请保留此声明.
  • 相关阅读:
    reduce端的连接实现
    Failed to stop mariadb.service: Interactive authentication required.
    Underlying cause: java.sql.SQLException : Access denied for user 'root'@'s150' (using password: YES)
    java.net.ConnectException: Call From s150/192.168.109.150 to s150:8020 failed on connection excepti
    启动hive出现 org.apache.hadoop.ipc.RemoteException(org.apache.hadoop.ipc.StandbyExceptio
    hive learing_1
    在hive中执行sql语句:SemanticException org.apache.hadoop.hive.ql.metadata.HiveException:
    MariaDB [(none)]> drop user cr; ERROR 1396 (HY000): Operation DROP USER failed for 'cr'@'%'
    ThreadGroupAPI
    使用setUncaughtExceptionHandler在线程外面捕获异常
  • 原文地址:https://www.cnblogs.com/houfeng/p/1528732.html
Copyright © 2011-2022 走看看