时间戳

首页 > 解决方案 > 在 Safari 中使用表格滚动边距顶部？

javascript - 在 Safari 中使用表格滚动边距顶部？

问题描述

我有一些粘性标题和指向表中行的锚链接。我试图找出一种方法让 safari 滚动到这些行而不将它们隐藏在粘性标题后面。在其他浏览器 scroll-margin-top 作品中，如何在 Safari 中进行这项工作？我尝试了一些使用负边距或伪元素的技巧，但没有成功。纯 CSS/HTML 解决方案可以做到这一点吗？

.heading {
      background: #ccc;
      height: 50px;
      line-height: 50px;
      margin-top: 10px;
      font-size: 30px;
      padding-left: 20px;
      position: -webkit-sticky;
      position: sticky;
      top: 0px;
   }
   .section, tr {
        margin: 0;
        scroll-margin-top: 50px;
    }
<body>
<article class="section" id="config"><h2 class="heading">My Header</h2>
<a href="#test">test</a><br>
<a href="#moretest">moretest</a><br>
<a href="#testagain">testagain</a><br><br><br><br><br><br><br><br><br><br><br><br>
</article>
<article class="section" id="config"><h2 class="heading">Table</h2>
    <br>
<table>
    <tr id="test">
        <td>test</td>
        <td>content</td>
        <td>hello</td>
    </tr>
    <tr id="moretest">
        <td>moretest</td>
        <td>morecontent</td>
        <td>hello</td>
    </tr>
    <tr id="testagain">
        <td>testagain</td>
        <td>content again</td>
        <td>hello again</td>
    </tr>
</table>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>...
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>...
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>...
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>...
</article>
</body>

标签： javascripthtmlcsssafari

解决方案

推荐阅读