[英]make html table <thead> fixed while scroll in dynamic <tbody> in php
I have dynamic table in php where <tbody>
content dynamically fetched from database, i want to make <thead>
fixed while scroll, my code work fine in static html <tbody>
. 我在php中有动态表,其中
<tbody>
内容是从数据库中动态获取的,我想在滚动时使<thead>
固定,我的代码在静态html <tbody>
正常工作。
Here is my code 这是我的代码
<div class="data">
<table>
<thead>
<tr>
<th>Page Id</th>
<th>User Id</th>
<th>Page Title</th>
</tr>
</thead>
<?php
foreach($this->analysisL as $key => $value) {?>
<tbody>
<tr>
<td><?php echo $value['daily_clicks']?></td>
<td><?php echo $value['RDCL']?></td>
<td><?php echo $value['SDCL']?></td>
</tr>
</tbody>
<?php }?>
</table>
</div>
Here is my css 这是我的CSS
body{
font-family: sans-serif;
}
h1{
font-size: 2em;
}
p{
margin-top: 1em;
}
div{
padding: 0 50px
}
.data{
position: fixed;
top: 0;
z-index: 0;
}
.content{
position: relative;
background: #fff;
z-index: 1;
padding: 50px;
}
th,td{
width: 200px;
padding: 3px;
}
th{
background: #ccc;
}
My Goal is to make table head fixed position while scroll and the content of table body dynamic fetching from database using php loop 我的目标是使表头在滚动时保持固定位置,并使用php循环从数据库动态获取表主体的内容
我建议您使用“ head fixer” js库( https://github.com/lai32290/TableHeadFixer )快速简便地固定桌子的头/脚。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.