带有 Fix header 的可滚动 Echo DB 表答案

【问题标题】：Scrollable Echo DB Table with Fix header带有 Fix header 的可滚动 Echo DB 表
【发布时间】：2019-02-02 00:41:32
【问题描述】：

我正在尝试制作一个带有修复标题的可滚动表格。如果将数据输入到 HTML，这很有效，但是当我尝试将数据库的内容回显到表格时，滚动条会混乱并且我的标题不再固定。如图所示，滚动条位于每个表格条目上。我已经尝试过 .div 像一些人那样将表格主体包裹起来，但它不起作用。

 body{
	background: lightblue;
}	

#tble th {
    text-align: left;
    background-color: green;
    color: white;
}

table{
  display: block;
  border: 1px solid;
  margin-top: 10px;
  width: 350px;
}

tbody{
  display: block;
  height: 50px;
  overflow-y: scroll;
}

th {
  width: 75px;
}

td { 
  width: 75px;
}

<html lang="en">
<body>
<table align="center" id="tble">
  <thead>
  <th style="text-align: center">ID</th>
  <th style="text-align: center">Username</th>
  <th style="text-align: center">Rights</th>
  <th style="text-align: center">Age</th>
  </thead>

  <tbody>   
  <tr>
  <?php
   $conn = mysqli_connect("localhost", "root", "", "account");
   $result = mysqli_query($conn, "SELECT * FROM account.log WHERE rights IN ('Admin','User')", MYSQLI_USE_RESULT) or die(mysql_error());
   while($row = mysqli_fetch_array( $result )) {
   ?>
    <td style="text-align: center"><?php echo $row['id']; ?></td>
   	<td style="text-align: center"><?php echo $row['user']; ?></td>
    <td style="text-align: center"><?php echo $row['rights']; ?></td>
    <td style="text-align: center"><?php echo $row['age']; ?></td>
		</tr>
  </tbody>
<?php 
}
?>
</body>
</table>

我错过了什么吗？希望有人能指出我正确的方向。

【问题讨论】：

不知道它是否会有所帮助，但您的代码会创建许多 </tr> 标签，但只有一个 <tr> w3schools.com/html/html_tables.asp\
把你的 标签放在你的 php 代码的 while 循环中，正如@Edgarth 所说，你正在生成多个 只有一个开始标签的标签
嗨@Edgarth - 我会试试的。我会回来的。谢谢！

您是否尝试在代码中添加 position:fixed 注释？？

没有问题，在 CSS 真正起作用之前需要进行大量的修改，但很高兴我能提供帮助

【解决方案1】：

<!-- language: lang-html -->

<html lang="en">
<body>
<table align="center" id="tble">
  <thead>
  <th style="text-align: center">ID</th>
  <th style="text-align: center">Username</th>
  <th style="text-align: center">Rights</th>
  <th style="text-align: center">Age</th>
  </thead>

  <tbody>   
  <tr>//move this from here
  <?php
   $conn = mysqli_connect("localhost", "root", "", "account");
   $result = mysqli_query($conn, "SELECT * FROM account.log WHERE rights IN ('Admin','User')", MYSQLI_USE_RESULT) or die(mysql_error());
   while($row = mysqli_fetch_array( $result )) {
   ?>
    <tr> //to here
    <td style="text-align: center"><?php echo $row['id']; ?></td>
    <td style="text-align: center"><?php echo $row['user']; ?></td>
    <td style="text-align: center"><?php echo $row['rights']; ?></td>
    <td style="text-align: center"><?php echo $row['age']; ?></td>
        </tr>
  </tbody>
<?php 
}
?>
</body>
</table>

【讨论】：

你好@Programming Newb - 我试过了，似乎没有任何改变。在我重新定位标签之后。