我该怎么做才能不让我的header%与页面的睡觉一起滚动呢?我想过利用frame-setsiframes,只是想知道是否有一种更简单、更用户友好的方式,做这件事的最佳实践是什么?

推荐答案

注:此答案的日期为2010年.考虑一下2021年的position: sticky,就像在another answer中提到的那样.


在包含标题的div上使用position: fixed,如下所示

#header {
  position: fixed;
}

#content {
  margin-top: 100px;
}

在本例中,当#content#header以下以http://reference.sitepoint.com/css/positionpx的速度启动时,但当用户滚动时,#header保持在原位.当然,不用说,你会想确保#header有一个背景,这样当两个div重叠时,它的内容实际上是可见的.看看这里的position房产:http://reference.sitepoint.com/css/position

Css相关问答推荐

Tailwind仅在启用时才在按钮上设置group-hover

如何在Elm中更改视图时添加过渡?

可折叠/可展开的数据表行:如何使Shadcn数据表中的可折叠内容全宽?

如何将Ant设计日期 Select 器的图标设置在输入 Select 器之前而不是之后

当鼠标移到侧边栏之外时,如何防止shiny 仪表板侧边栏菜单中的 pickerInput 选项被切断?

CSS Select 标签旁边的文本并输入

当滚动量较小时,在滚动问题上动画粘性导航

为什么所有选项卡都没有显示在 React 的 MUI 选项卡组件中?

带插值的 Sass 数学函数

before 元素的过渡效果

Tailwind css 和 Next.js 导航组件 z-index 不工作

css ::part 伪 Select 器 Chrome 兼容性?

如何让我的注册按钮在我的网站上像球一样 skip ?

循环一个 sass/scss 变量以生成 css 变量

如何将转换应用于相同的元素但处于不同的状态:悬停

圆形加载动画

使用 Twitter Bootstrap 使页脚粘在页面底部

边界半径应该剪辑内容吗?

使用 :focus 设置外部 div 的样式?

仅当存在 2 个类时,您可以使用 CSS 定位元素吗?