如何在滚动正文时保持 HTML 表格标题可见？

如何在 html 表格上显示滚动条

创建 HTML 表格时，有时需要让标题保持可见，即使表格内容滚动也是如此。

要实现此目的，请将表格包装在具有 Overflow:auto CSS 属性的非静态定位 div 中。然后，将元素绝对定位在表头中，如下所示：

#table-wrapper {
  position:relative;
}
#table-scroll {
  height:150px;
  overflow:auto;  
  margin-top:20px;
}
#table-wrapper table {
  width:100%;
}
#table-wrapper table * {
  background:yellow;
  color:black;
}
#table-wrapper table thead th .text {
  position:absolute;   
  top:-20px;
  z-index:2;
  height:20px;
  width:35%;
  border:1px solid red;
}

<div><p>这将创建一个具有固定表头和滚动正文的表，类似于提供的 URL 中的方法 2。 </p></div>

以上是如何在滚动正文时保持 HTML 表格标题可见？的详细内容。更多信息请关注PHP中文网其他相关文章！