css 将元素向下推到初始视口下方[关闭]

w6lpcovy  于 2023-08-09  发布在  其他
关注(0)|答案(1)|浏览(81)

**已关闭。**此问题需要debugging details。它目前不接受回答。

编辑问题以包括desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem。这将有助于其他人回答这个问题。
2天前关闭。
Improve this question
我有一个静态页脚,是在每一页。有些页面,如登录页面特别短,因此允许页脚可见,而无需滚动。然而,我希望页脚只有在用户开始滚动时才能看到,方法是将元素推到视口底部下方1 px;我该怎么做?

6l7fqoea

6l7fqoea1#

一个可能的解决方案是使 footersticky位于bottom: 0,并具有负z索引。将 main 设置为min-height: 100dvh;。范例:

* {
  margin: 0;
  box-sizing: border-box;
}

main {
  min-height: 100dvh;
  padding: 2rem;
  background: #fff;
}

body > footer {
  position: sticky;
  z-index: -1;
  bottom: 0;
  padding: 2rem;
  background: #333;
  color: #fff;
}

个字符

相关问题