MuscleOf2016
0D

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

  •  
  •   MuscleOf2016 · Aug 18, 2024 · 1444 views
    This topic created in 661 days ago, the information mentioned may be changed or developed.

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

    4 replies    2024-08-19 23:17:49 +08:00
    xiangyuecn
        1
    xiangyuecn  
       Aug 18, 2024
    我想着手机上也没有 IE6 要你去兼容啊😂,垂直的 flex 布局不就是几行代码的事,最外层 100vh
    defaw
        2
    defaw  
       Aug 19, 2024
    纵置 flex ,navbar 设置 flex 权重,内容区会自动填满剩下的空间
    june4
        3
    june4  
       Aug 19, 2024
    最佳方案是 position: sticky
    luwang
        4
    luwang  
       Aug 19, 2024 via Android
    https://myblog.wallleap.cn/#/
    我用的 position fixed ,基本能正常显示,也会随着浏览器工具栏显示隐藏调位置
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5571 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 47ms · UTC 05:58 · PVG 13:58 · LAX 22:58 · JFK 01:58
    ♥ Do have faith in what you're doing.