1

我怎样才能?

鉴于下面的 html 编码,我该如何 1.) 锁定第一行(表格标题)以防止滚动和 2.) 具有 1px 实心 #cccccc 的内部表格边框

感谢你的帮助!

周杰伦

风格编码:

<style type="text/css">
div#data_container {
width: 800px;
height: 75px;
overflow: auto;
border: 1px solid #cccccc;

}
table#data_tbl {
  border-collapse: collapse;
  table-layout: fixed;
}
table#data_tbl td {
  border: 0px;
}
table#data_tbl tr:first-child td { 
color: #235A81;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#cdcdcd");
}
</style>

身体:

<!-- START OF DATA CONTAINER -->
<div id="data_container">

    <table id="data_tbl">
        <td>File Number</td>
        <td>Date Received</td>
        <td>Request Type</td>
        <td>Name</td>
        <tr>
            <td>12345678</td>
            <td>08/01/2013</td>
            <td>Billing</td>
            <td>Joe Smith</td>
        </tr>
        <tr>
            <td>09876543</td>
            <td>09/01/2013</td>
            <td>Technical</td>
            <td>Nancy Edwards</td>
        </tr>
        <tr>
            <td>11223344</td>
            <td>10/01/2013</td>
            <td>Operations</td>
            <td>Jill White</td>
        </tr>
        <tr>
            <td>45678931</td>
            <td>12/01/2013</td>
            <td>Billing</td>
            <td>Michael Burns</td>
        </tr>
        <tr>
            <td>85239975</td>
            <td>09/01/2013</td>
            <td>Support</td>
            <td>Debbie Stewart</td>
        </tr>
        <tr>
            <td>55667788</td>
            <td>11/01/2013</td>
            <td>Administrative</td>
            <td>David Adams</td>
        </tr>
    </table>
</div>
<!-- END OF DATA CONTAINER -->
4

3 回答 3

0

当框出现时,您可以style="overflow:hidden"th标签上设置。它将锁定鼠标滚动或position:fixed在盒子上使用。

于 2013-01-08T16:51:51.933 回答
0

边框样式表:

table {
position: relative;
}
table, th, td {
border: 1px solid #cccccc;
}
于 2013-01-08T16:33:11.173 回答
0

最简单的方法是使用 3rd 方插件。看看这个:http ://dlippman.imathas.com/projects/tablescroller.php或尝试 datatables.net

于 2013-01-08T16:33:14.373 回答