html – 固定的导航栏与iPhone上的浏览器顶部分离

前端之家收集整理的这篇文章主要介绍了html – 固定的导航栏与iPhone上的浏览器顶部分离前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个带有自举固定到顶部导航栏( example here)的网站,并注意到,在iPhone上使用Chrome,当快速滚动时,导航栏与屏幕顶部分离只有几个像素.在下面的屏幕截图中显示,从引导导航栏的示例页面

这只会发生在Chrome上的iPhone上,而不是在iPad或任何我测试过的Mac / PC上.它也发生在每个具有固定导航栏的网站上,我可以找到.我唯一可以想到的是将导航栏的背景颜色延伸到浏览器顶部的上方,以便当导航栏最终被拉下时,它不会与屏幕完全分开.然而,这仍然使导航栏的内容被拉下来,当然似乎是一个脏的修复.

有没有人遇到这个问题,有没有什么已知的修复可用?

解决方法

我用一个棘手的方式来弥补这个差距,
我设置padding-top:100px到nav,然后margin-top:-100px,
所以当它再次发生时,这个差距将被填充顶部填满.

到目前为止,它工作正常,希望这也可以帮助你.

原文链接:https://www.f2er.com/html/227962.html

猜你在找的HTML相关文章