2

我需要冻结下表的第一行，下面是我当前的代码如果您需要更多信息，请告诉我

这是一张桌子的图片：

<head>
<style> 
   table,td,th
   {border-collapse:collapse;}
   table.myTable td, table.myTable th { border:1px solid black;padding:5px;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   color:#2C3539;
   font-size:0.80em}

   table
   {width:100%;}
   th{background-color:#B6B6B4;
   height:10px;}
</style>

<table class="myTable">
<?php
//MySQL Database Connect
include 'connect.php';
 echo "
 <tr>
 <th>Name</th>
 <th>Location</th>
 <th>Email</th>
 <th>Mobile</th>
 <th>IMEI</th>
 <th>Phone</th>
 <th>Message</th>
 </tr></Freezing>";

 while($row = mysqli_fetch_array($result))

   {
   echo "<tr>";
   echo "<td>" . $row['Name'] . "</td>";
   echo "<td>" . $row['Location'] . "</td>";
   echo "<td>" . $row['Email'] . "</td>";
   echo "<td>" . $row['Mobile'] . "</td>";
   echo "<td>" . $row['IMEI'] . "</td>";
   echo "<td>" . $row['Phone'] . "</td>";
   echo "<td>" . $row['Message'] . "</td>";
   echo "</tr>";
   }
 echo "</table>";

mysqli_close($con);
 ?>
4

2 回答 2

2

试试这个，它使用 jquery 虽然Freeze Header

于 2013-09-05T15:14:31.100 回答
2

您可以做的是使用<thead>来分割您的<th>标签。然后，您可以使用固定定位的绝对值使该部分浮动在其他部分之上。这是一个例子：

HTML

<thead>
    <tr>
        <th>Name</th>
        <th>Location</th>
        <th>Email</th>
        <th>Mobile</th>
        <th>IMEI</th>
        <th>Phone</th>
        <th>Message</th>
    </tr>
</thead>
<tbody>
...
</tbody>

CSS

thead { 
    display: block;
    position: absolute; 
    top: 0;
    left: 0;
    width: 100%
    z-index: 100;
}

您可能还需要在<tbody>标签顶部添加一些填充，以便冻结的行不会位于任何数据的顶部。此外，绝对定位将相对于最近的定位祖先，因此您可能还需要向表格添加位置。

table {
    position: relative;
}
tbody {
    padding-top: 1em;
}
于 2013-09-05T14:41:58.627 回答