html – WordPress Twenty Seventeen Header Scroll Mobile Zoom
发布时间：2020-12-14 18:33:25 所属栏目：资源 来源： https://2017.wordpress.net/
导读：我在我的网站上使用WordPress Twenty Seventeen,我在手机上的标题图片有问题.当我开始滚动时,标题图像有点放大,我试图谷歌这个问题,但没有提出任何东西,我已经尝试通过CSS代码,并没有看到任何转换或元素在我改变时检查他们,这是一个示例网站： https://2017.
|
我在我的网站上使用WordPress Twenty Seventeen,我在手机上的标题图片有问题.当我开始滚动时,标题图像有点放大,我试图谷歌这个问题,但没有提出任何东西,我已经尝试通过CSS代码,并没有看到任何转换或元素在我改变时检查他们,这是一个示例网站：
https://2017.wordpress.net/ 当您开始滚动时,标题图像是缩放的缩放,是否有防止这种情况,因此它在滚动之前保持相同的大小？ 解决方法
发生这种情况是因为mobile-chrome计算地址栏到视口高度,在滚动网页时,地址栏也会滚动,可见区域动态地改变它的高度.
例如.在320px X 360px屏幕上,在带有地址栏的mobile-chrome上,视口高度为564px,在地址栏消失后滚动后,视口高度变为620px. 视口高度与地址栏 视口高度没有地址栏 现在.wp-custom-header中的图像采用最小高度：100％;高度：100％将动态改变高度,因此图像在滚动时改变它的尺寸. 更好的方法是在媒体查询中以像素为单位修复图像的高度. .has-header-image .custom-header-media img{
height: 620px;
min-height: 0;
}
类似的问题： css3-100vh-not-constant-in-mobile-browser （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |