Question

我有一张简单的桌子。我的标题不粘。我试过多种方法，但它没有用。我的列表太大了，所以我打算只为行而不是标题设置一个滚动条。我的专栏可以调整大小。

thead {
    display: table-header-group;
    vertical-align: middle;
    border-color: inherit;
}


tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit;
}

Answer 1

粘性可能有点棘手（抱怨双关语）

这里的事情可能是粘性对象和父对象都需要是一个块。然而，这并不符合您对列可调整大小的要求。

我使用一点jquery来结合两者的优点：

$('table, td, th, thead').width(function() {    
    return $(this).width();
});

$('td, th').height(function() { 
    return $(this).height();
});

$('table, thead').css('display','block')

这样你就会坚持（在你输入正确的CSS之后）

position: -webkit-sticky;
position: -moz-sticky;
position: -ms-sticky;
position: -o-sticky;
position: sticky;
top: 0px;

（不要忘记顶部：0px！）

粘性标题，列宽可调整大小

1 个答案: