易笔记易笔记
首页
文章
分类
标签
首页
文章
分类
标签
LangChain 1cesium 2CSS 10iOS 1Safari 1ide 1PHP 1Flexbox 1JS 3ThreeJS 23D 2Vue 7Windows 4KMS 1Vue 3 1Composition API 1ref 1reactive 1Vue3 4uni-app 1Form 1Modal 1虚拟滚动 1
固定头尾布局

核心逻辑 (Pseudo-code)

Layout:
  Container:
    height: 100vh          # 视口高度
    display: flex-column   # 垂直弹性布局

  Item(Header):
    height: fixed          # 固定高度
    shrink: 0              # 禁止压缩

  Item(Content):
    grow: 1                # 占满剩余空间
    overflow-y: scroll     # 内容滚动

  Item(Footer):
    height: fixed          # 固定高度
    shrink: 0              # 禁止压缩
分类: Layout标签: CSS, Flexbox
日期: 2025/12/18