V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
MuscleOf2016
V2EX  ›  前端开发

移动端 web 如何实现 navbar+内容区域?

  •  
  •   MuscleOf2016 · 107 天前 · 721 次点击
    这是一个创建于 107 天前的主题,其中的信息可能已经有所发展或是发生改变。

    实现手机 App 那种 navbar+内容区域,内容区域如果内容超出自动滚动,navbar 固定,各位都如何实现的。 给内容区域设置了 overflow-y 自动,如果没设置一个固定高度,不生效。就用 js 获取界面除了 navbar 之外的高度,这样做行嘛?

    4 条回复    2024-08-19 23:17:49 +08:00
    xiangyuecn
        1
    xiangyuecn  
       107 天前
    我想着手机上也没有 IE6 要你去兼容啊😂,垂直的 flex 布局不就是几行代码的事,最外层 100vh
    defaw
        2
    defaw  
       106 天前
    纵置 flex ,navbar 设置 flex 权重,内容区会自动填满剩下的空间
    june4
        3
    june4  
       106 天前
    最佳方案是 position: sticky
    luwang
        4
    luwang  
       106 天前 via Android
    https://myblog.wallleap.cn/#/
    我用的 position fixed ,基本能正常显示,也会随着浏览器工具栏显示隐藏调位置
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1270 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 18:06 · PVG 02:06 · LAX 10:06 · JFK 13:06
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.