html - 使用 CSS/HTML 的“卡住 Pane ”式效果

Question

是否可以/容易地创建一个类似于 Microsoft Excel 电子表格并应用了“卡住 Pane ”的网页？我的意思是，页眉和侧边栏应保持固定在它们的位置，但在页面滚动时向下/向右滚动。

我需要像 this 这样的东西, 除了我希望它应用于整个页面而不是表格。

Answer 1

这可以通过切换到 position: fixed 来实现。

例如带有类的div

#fixed-div {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;
  background-color: #000;
}

滚动时将固定在浏览器视口(viewport)的最上方 100 像素处。

这个 fiddle 演示了垂直和水平方向的效果。 http://jsfiddle.net/ukzYf/1/

希望这对您有所帮助。