文章/答案/技术大牛

发布

社区首页 >问答首页 >如何使用CSS sticky

问如何使用CSS sticky
EN

Stack Overflow用户

提问于 2019-03-27 21:55:08

回答 1查看 36关注 0票数 0

我已经创建了简单的表格，它应该在顶部有粘性标题(TR)。但这是行不通的。我如何修复这段代码？

谢谢

<!DOCTYPE html>
<HTML><HEAD></HEAD><BODY>
<P>HELLO<P>

<TABLE BORDER=1 STYLE="border: 3px solid #4285F4;background-color:#EEEEEE;width:1600px;">
<thead STYLE="position: sticky; top:0;">
<TR    style="border:0px solid #888888;">
<TH STYLE="height:200px;width:800px;">hello 5</TH><TH STYLE="width:800px;">hello 5</TH>
</TR>
</thead>

<TR style="">
<TD STYLE="height:200px;">hello 5</TD><TD>hello 5</TD></TR>
</TABLE>

HELLO TEXT 1

<TABLE BORDER=1 STYLE="position: sticky; top: 0;border-collapse: collapse;border: 3px solid #4285F4;background-color:#EEEEEE;">
<TR    style="border:0px solid #888888;">
<TD STYLE="height:200px;">hello 5</TD><TD>hello 5</TD>
</TR>
<TR style="">
<TD STYLE="height:200px;">hello 5</TD><TD>hello 5</TD></TR>
</TABLE>

<DIV STYLE="width:1600px;">
HELLO TEXT 3...  HELLO TEXT 3...  HELLO TEXT 3...  HELLO TEXT 3...  HELLO TEXT 3...  HELLO TEXT 3...   
</DIV>

</BODY></HTML>

position

sticky

html

css

回答 1

Stack Overflow用户

发布于 2019-03-28 05:39:08

这应该是可行的。尽量把css和html放在单独的文件中，这样你的代码就更容易阅读了。

tr {
position:sticky;
top:0;
}

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/55378968

复制

相似问题

问如何使用CSS sticky
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用CSS stickyEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用CSS sticky
EN