博客
关于我
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/

    你可能感兴趣的文章
    pageHelper分页工具的使用
    查看>>
    pageHelper分页技术
    查看>>
    PageHelper分页查询遇到的小问题
    查看>>
    PageHelper实现分页详细版、整合SSM应用
    查看>>
    PageHelper常见问题
    查看>>
    SpringBoot中配置为开发模式,代码修改后不用重新运行
    查看>>
    springboot中pom.xml、application.yml、application.properties
    查看>>
    PageHelper:上手教程(最详细)
    查看>>
    PageOffice如何实现从零开始动态生成图文并茂的Word文档
    查看>>
    PageRank算法
    查看>>
    Paint类(画笔)
    查看>>
    paip. 调试技术打印堆栈 uapi print stack java php python 总结.
    查看>>
    paip.android 手机输入法制造大法
    查看>>
    paip.spring3 mvc servlet的配置以及使用最佳实践
    查看>>
    Palindrome Number leetcode java
    查看>>
    Palo Alto Networks Expedition 未授权SQL注入漏洞复现(CVE-2024-9465)
    查看>>
    Palo Alto Networks Expedition 远程命令执行漏洞(CVE-2024-9463)
    查看>>
    Palo Alto Networks PAN-OS身份认证绕过导致RCE漏洞复现(CVE-2024-0012)
    查看>>
    Panalog 日志审计系统 libres_syn_delete.php 前台RCE漏洞复现
    查看>>
    Springboot中@SuppressWarnings注解详细解析
    查看>>