zoukankan      html  css  js  c++  java
  • 【问题】VH

     
    【问题】: CSS中使用了VH,在iOS中展示正常,但是在安卓的个别浏览器中,当输入框弹出时,使用VH的DIV的高度会发生变化。
    【原因】: 在安卓端浏览器虚拟键盘弹出时,导致视口高度改变,以至于vh的取值改变;页面中使用vh定高的元素的大小被压缩,造成布局错位以及文字溢出。
     
    正常模式下
    100vh = document.documentElement.clientHeight;
     
    安卓端弹出虚拟键盘情况下
    100vh = document.documentElement.clientHeight - 虚拟键盘的高度;
     
    【解决】: 使用rem/px进行布局暂时修复
     
    【补充】:
    1. vw:viewpoint width,视窗宽度,1vw等于视窗宽度的1%。
    2. vh:viewpoint height,视窗高度,1vh等于视窗高度的1%。
    3. vmin:vw和vh中较小的那个。
    4.  vmax:vw和vh中较大的那个。
    5.  px:绝对单位,页面按精确像素展示
    6. em:相对单位,基准点为自身或父节点字体的大小
    7.  rem:相对单位,可理解为”root em”,相对根节点html的字体大小来计算
  • 相关阅读:
    JS使用 popstate 事件监听物理返回键
    JQ判断div是否隐藏
    SQL Server DATEDIFF() 函数
    取消a或input标签聚焦后出现虚线框
    C#定时任务
    C# 保留N位小数
    C#打印单据
    SQL语句创建函数
    SVN检出新项目
    解决jQuery的toggle()的自动触发问题
  • 原文地址:https://www.cnblogs.com/lilicat/p/9829947.html
Copyright © 2011-2022 走看看