css漂浮列标题

我有一个关于CSS的简单问题。在我的项目中，我有一个长宽表。就像这样：css漂浮列标题

喜欢您所看到的底部滚动nesesery。预测是他下月的头像。在第二个屏幕上，当我滚动到结尾时，您会看到情况。

现在预测文本位于单元格的中心。因此，当这个单元格将会更长时间，预测文本将只有当我scrool中心可见。我的问题是：是否有可能让这个文本总是可见的，当我在预测部分使用scroolin并且使用scrool浮动时？

来源

2016-11-15 Przemysław Zamorski

只有定位基础上所显示的视窗，而不是文件流，我能想到的元素的方法是'位置：fixed'。至少如果你正在寻找一个不是JavaScript的CSS解决方案。 –

我宁愿在知道滚动条位置的地方寻找JavaScript解决方案。这比一个奇怪的CSS定位更稳定，并且感觉不到“哈克”。 –

作为一种解决方案，您可以创建一个具有透明背景的绝对定位图层。

看一个片断为例：

.div1 { 
 
    width: 400px; 
 
    height: 200px; 
 
    overflow-x: scroll; 
 
    overflow-y: hidden; 
 
    background-color: green; 
 
    color: yellow; 
 
} 
 
.div2 { 
 
    position: relative; 
 
    width: 1000px; 
 
    height: 170px; 
 
    background-color: yellow; 
 
    color: green; 
 
    top: 30px; 
 
} 
 
.hdr { 
 
    position: absolute; 
 
    left: 8px; 
 
    top: 8px; 
 
    text-align: center; 
 
    width: 400px; 
 
    height: 30px; 
 
    background: transparent; 
 
    color: white; 
 
}

<div class="div1"> 
 
    <div class="hdr">HEADER</div> 
 
    <div class="div2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis fringilla tellus. Pellentesque porttitor elit sit amet arcu efficitur, vel ultricies lacus posuere. Etiam sed quam quis 
 
tellus accumsan vehicula quis a enim. 
 
Donec volutpat, justo ut tempor facilisis, dui erat semper leo, vel facilisis libero arcu quis est. Mauris dapibus hendrerit porta. Sed non nisi libero. In hac habitasse platea dictumst. Aliquam erat volutpat. Etiam rhoncus, metus vel 
 
ultrices scelerisque, magna felis dignissim tellus, in suscipit neque diam eu libero. Fusce accumsan fringilla libero, ut auctor odio maximus vel. 
 
Aenean a venenatis leo, elementum varius enim. Donec vitae turpis sit amet magna aliquet pulvinar nec eget odio. Ut vitae ornare augue. 
 
Sed iaculis enim at scelerisque suscipit. Cras at tortor congue, vestibulum ipsum a, viverra lectus. Cras massa neque, commodo sed lacus id, convallis sodales urna</div> 
 
    </div>

来源

2016-11-15 12:34:37 Banzay

css漂浮列标题

回答

相关问题