易笔记易笔记
首页
文章
分类
标签
首页
文章
分类
标签
LangChain 1Prompt 1Frontend 1cesium 2CSS 10iOS 1Safari 1css 1font 1typography 1ide 1JS 3Flexbox 1PHP 1ThreeJS 23D 2Vue 8Vue 3 1Composition API 1ref 1reactive 1Vue3 5uni-app 1Form 1Modal 1虚拟滚动 1Windows 4KMS 1JavaScript 1浏览器 API 1requestIdleCallback 1性能优化 2组件 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
日期: 12/18/2025