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

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

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

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

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

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

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

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

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

    你可能感兴趣的文章
    OSPF技术连载20:OSPF 十大LSA类型,太详细了!
    查看>>
    OSPF技术连载21:OSPF虚链路,现代网络逻辑连接的利器!
    查看>>
    OSPF技术连载22:OSPF 路径选择 O > O IA > N1 > E1 > N2 > E2
    查看>>
    OSPF技术连载2:OSPF工作原理、建立邻接关系、路由计算
    查看>>
    OSPF技术连载5:OSPF 基本配置,含思科、华为、Junifer三厂商配置
    查看>>
    OSPF技术连载6:OSPF 多区域,近7000字,非常详细!
    查看>>
    OSPF技术连载7:什么是OSPF带宽?OSPF带宽参考值多少?
    查看>>
    OSPF技术连载8:OSPF认证:明文认证、MD5认证和SHA-HMAC验证
    查看>>
    OSPF故障排除技巧
    查看>>
    spring配置文件中<context:property-placeholder />的使用
    查看>>
    OSPF有哪些优势?解决了RIP的什么问题?
    查看>>
    OSPF理论
    查看>>
    OSPF的七种类型LSA
    查看>>
    OSPF的安全性考虑:全面解析与最佳实践
    查看>>
    OSPF知识点大全,网络工程师快速收藏!
    查看>>
    ospf综合实验2 2012/9/8
    查看>>
    OSPF规划两大模型:双塔奇兵、犬牙交错
    查看>>
    OSPF认证
    查看>>
    OSPF设计原则,命令以H3C为例
    查看>>
    ospf路由 华3_动态路由OSPF基本原理及配置,一分钟了解下
    查看>>