css 如何防止标题移动时，你开始滚动？

hkmswyz6 于 2023-03-14 发布在其他

关注(0)|答案(1)|浏览(104)

这是我目前的代码给定的标题：

#navbar__title {
  background-color: white;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  cursor: pointer;
  font-size: 2rem;
  position: fixed;
  padding-left: 120px;
  padding-top: 15px;
}

由于某种原因，当我向下滚动，这是唯一的东西，不想停留在地方，它是灵活的宽度，但不知何故，它就是不想停留，我尝试的立场：修复了，但它不起作用。我如何防止这种情况发生？我应该做些什么来防止将来在其他元素上发生这种情况？

css

来源：https://stackoverflow.com/questions/75717182/how-to-prevent-title-from-moving-when-you-start-scrolling

1条答案

按热度按时间

vngu2lb81#

我发现这个代码从w3schools.not确定如果它看起来像你的或没有，但让我知道。

<!DOCTYPE html>
<html>
<head>
<style>
div.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  padding: 5px;
  background-color: #cae8ca;
  border: 2px solid #4CAF50;
}
</style>
</head>
<body>

<p>Try to <b>scroll</b> inside this frame to understand how sticky positioning works.</p>

<div class="sticky">I am sticky!</div>

<div style="padding-bottom:2000px">
  <p>In this example, the sticky element sticks to the top of the page (top: 0), when you reach its scroll position.</p>
  <p>Scroll back up to remove the stickyness.</p>
  <p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.</p>
  <p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.</p>
</div>

</body>
</html>

赞(0）回复(0）举报 2023-03-14

我来回答

css 如何防止标题移动时，你开始滚动？

1条答案

相关问题

热门标签

最新问答