18910140161

HTML-是URI片段变量的登录位置。还是总是最好的?-堆栈溢出

顺晟科技

2022-10-18 12:10:17

161

所以,当你在页面上用EG进行内部链接时。<a href="#fragment"><div id="fragment">,并单击它,它会将目标始终放置在视口的最顶部(即滚动条所能到达的最远位置)

有没有一种方法来解决/修改该位置,例如,你的视口的绝对中心?


顺晟科技:

可以使用scroll-margin属性添加边距。将scroll-margin添加到目标元素。(此处#fragment).

例如:

<代码>#片段{边距:1000px 0;/*只是为了使页面可滚动*/滚动边距:50VH;}
<代码><;A href=“#fragment ”>;单击我<;/A>;<;DIV ID=“片段”>;Lorem ipsum dolor sit,amet consectetur adipisicing elit.Pariatur Maxime,Iusto Accusamus Rerum Dignissimos Vero Minima中的Acguantium Eius减去Doloribus Inventore Ipsam Distinctio,Natus Aut Velit Autem Dolorem Reprehenderit.<;/DIV>;


解释:

这里#fragment { margin: 1000px 0; /*Just to make the page scrollable*/ scroll-margin: 50vh; }<a href="#fragment">Click Me</a> <div id="fragment"> Lorem ipsum dolor sit, amet consectetur adipisicing elit. Pariatur maxime, accusantium eius in iusto accusamus rerum dignissimos vero minima minus doloribus inventore ipsam distinctio, natus aut velit autem dolorem reprehenderit. </div>将在单击链接时使元素#Fragment显示在当前视口高度的50%上。


代码PEN

  • TAG:
相关文章
我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航