我有一个固定的边栏,有三个部分:页眉、内容和页脚。侧栏总是占据视口的高度。下面是我希望侧边栏表现的规范,用一个图来说明。
让:
V、H、C和F是视口、页眉、内容和页脚框的高度。
Cmin是C的最小值。
Hc、Cc和Fc是页眉、内容和页脚框的高度(这些是常量)。
规格如下:
若V> Hc + Cc + Fc
正常流显示了一切(图1.1)
若V< Hc + Cc + Fc
若V> Hc + Cmin + Fc
C减少,而H和F保持不变(图1.2)
内容获得滚动条
- if V < H
使用CSS,当页面是scrolling or not时,我如何才能简单地获得一个永远显示的sticky header and footer页面。我在网上找到了一些样本,但我想要的是,中间的内容区域应该是一个100% stretched area between header and footer,无论浏览器的大小是什么。
我的意思是,我发现的大多数样本,都是正确地制作页眉和页脚粘性的……,但实际上是these are just floating和covering the Top and Bottom parts of the 'middle' content area。那不是我