Javascript 放置“粘滞”以使表行彼此粘滞

Javascript 放置“粘滞”以使表行彼此粘滞,javascript,html,css,frontend,sticky,Javascript,Html,Css,Frontend,Sticky,您好,我正试图使表与列,将能够坚持彼此,而我滚动水平。我使用的是position sticky,它可以正确处理第一列,当添加第二列或第三列时,问题就开始了。特别是其他列的宽度总是不同的,这使得我无法使用相同的宽度乘以列数 我能让它们彼此粘在一起而不知道它们的宽度吗?是否有可能使文本出现在另一个文本之上,而不会相互碰撞,造成无法阅读的混乱 .sticky col{ 位置:粘性!重要; z指数:1000; 排名:0; 自我校准:灵活启动; 左:0; } 名字 姓氏 年龄 前夕 杰克逊 94 吉尔

您好,我正试图使表与列,将能够坚持彼此,而我滚动水平。我使用的是position sticky,它可以正确处理第一列,当添加第二列或第三列时,问题就开始了。特别是其他列的宽度总是不同的,这使得我无法使用相同的宽度乘以列数

我能让它们彼此粘在一起而不知道它们的宽度吗?是否有可能使文本出现在另一个文本之上,而不会相互碰撞,造成无法阅读的混乱

.sticky col{
位置:粘性!重要;
z指数:1000;
排名:0;
自我校准:灵活启动;
左:0;
}

名字
姓氏
年龄
前夕
杰克逊
94
吉尔
史密斯
50
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94

您有一个良好的开端,您可以将您的风格应用于所有
td
tr

td,
th{
位置:粘性;
排名:0;
自我校准:灵活启动;
左:0;
背景色:#fff;
}

名字
姓氏
年龄
前夕
杰克逊
94
吉尔
史密斯
50
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94
前夕
杰克逊
94

更改第二列和第三列的left属性。 在你的例子中尝试100px,然后我将从左边粘贴100px


您还需要稍微调整一些背景颜色,可能还有一些表格标题的文本对齐。

这解决了第二个问题,第一个问题仍然存在,整个线索是这样的,我可以让1列水平移动,然后另一列添加到其中,所以我移动两个collumn,如果我想,我可以让3列水平移动,彼此相邻,不在彼此之上。有没有不使用背景色的解决方案?如果您没有
背景色
,则您的行是
透明的
,并允许查看后面的行。您应该在编辑器中使用片段创建演示。继续,从问题中抄下片段并修改它。“相互坚持”不是一个非常具体的行为描述。看起来更像是要折叠或重叠。请修改以更清楚地了解这一点。