位置与nextjs粘在一起

发布于 2025-01-25 07:58:48 字数 410 浏览 1 评论 0原文

我是新手的粘性,我以前没有使用过,所以我复制&将一些代码粘贴到我的项目中,但它不起作用。

<Layout title="Books">
      <div className="container w-100 row">
        <div className="sticky-top col-sm-3">
          <Filter />
        </div>
        <div className="col-sm-9 ">
          <Books />
        </div>
      </div>
      <Footer />
    </Layout>

im new to sticky and i didn't use it before, so i copy & paste some codes (about sticky sidebar) into my project but it doesn't work.

<Layout title="Books">
      <div className="container w-100 row">
        <div className="sticky-top col-sm-3">
          <Filter />
        </div>
        <div className="col-sm-9 ">
          <Books />
        </div>
      </div>
      <Footer />
    </Layout>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

油饼 2025-02-01 07:58:48

没有现场预览,很难说。但是在使用之前: 粘性;几乎要记住:

  1. 位置: 粘贴如果祖先元素具有溢出属性的以下值之一:hiddenscrollauto
  2. 您必须指定至少具有顶部bottos的阈值, 。

It's hard to tell without a live preview. But before using position: sticky; there are few things to remember:

  1. position: sticky won't work if ancestor element has one of the following values for the overflow property: hidden, scroll, or auto
  2. You must specify a threshold with at least one of top, right, bottom, or left for sticky positioning to behave as expected.
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文