博客
关于我
ios中safari浏览器100vh带有滚动条?
阅读量:157 次
发布时间:2019-02-28

本文共 337 字,大约阅读时间需要 1 分钟。

在移动端Safari或Chrome浏览器中,使用100vh可能会引起滚动条的出现,这通常与浏览器的地址栏高度计算方式有关。

在Safari和Chrome中,100vh的定义通常指的是去掉地址栏后的可用高度。这种设计导致页面内容在满屏显示时仍会出现滚动条,影响用户体验。

对于移动端开发,Chrome的用户基数较小,若只考虑微信公众号等特殊场景,通常无需特别处理。然而,如果需在Safari中优化用户体验,可以采取以下方法:

  • 使用100%替代100vh:这种方式在所有浏览器中都能稳定地实现满屏布局,无滚动条。

  • 结合JavaScript 代替vh单位:通过动态计算可用高度,并根据浏览器的具体实现调整布局。

  • 建议根据项目需求选择最合适的方案,确保在目标浏览器中的最佳显示效果。

    转载地址:http://pgad.baihongyu.com/

    你可能感兴趣的文章
    Python3+Requests+Unittest实战系列【一】
    查看>>
    python3+requests+unittest实战系列【一】
    查看>>
    python3+requests+unittest实战系列【二】
    查看>>
    Python3+Requests+Unittest实战系列【二】
    查看>>
    python3----ASCII
    查看>>
    Python3-selenium自动化测试框架,结合HTMLTestRunner测试报告!
    查看>>
    Python3-如何自我更新作为服务运行的应用程序
    查看>>
    Python3.1-网格模拟概念性问题
    查看>>
    Python3.12 解决conda环境libstdc++版本过低问题
    查看>>
    python3.2批量查询IP地址区域
    查看>>
    Python3.5中协程和未来/任务之间的区别?
    查看>>
    python3.5实现socket通讯(TCP)
    查看>>
    python3.6 ubuntu部署nginx、 uwsgi、 django
    查看>>
    Python3.6.3中,functools似乎不能用
    查看>>
    python3.6.5+cuda9+cudnn7.1+win10+tensorflow-gpu1.9.0下载配置
    查看>>
    python3.6使用pickle序列化class
    查看>>
    python3.6入门到高阶(全栈) day027 网络通信协议 osi七层模型
    查看>>
    Python3.6属性错误:模块‘;异步没有属性‘;运行‘;
    查看>>
    python3.6版本中的python-weka-wrapper安装失败,错误代码为%1
    查看>>
    Python3.7安装cv2踩过的坑
    查看>>