如何在移动设备上调整网站的ui

Posted

技术标签:

【中文标题】如何在移动设备上调整网站的ui【英文标题】:How to adjust the ui of website on mobile devices 【发布时间】:2021-09-09 22:34:23 【问题描述】:

所以我有一个网站,在 PC 上一切正常,但是当你从手机打开它时,网站会被移动浏览器的导航菜单移动。网站的高度正好是 100vh,但被导航栏取代了

【问题讨论】:

欢迎来到 ***。请提供更多详细信息,例如您使用的框架。在 stackblitz 等软件上提供最小的复制。 【参考方案1】:

这似乎是您问题的解决方案: https://chanind.github.io/javascript/2019/09/28/avoid-100vh-on-mobile-web.html

基本上使用 javascript 和 window.innerHeight 而不是 CSS

【讨论】:

以上是关于如何在移动设备上调整网站的ui的主要内容,如果未能解决你的问题,请参考以下文章

移动到网站中心(如果可能,在移动设备上自动调整大小)

当我将屏幕大小调整为移动设备时,我的网站移动视图在桌面上正确显示隐藏元素,但在我的手机上它们没有隐藏

Material ui appbar 在移动设备上不会缩小

如何使用 Twitter Bootstrap 使网站适合移动设备?

如何在移动设备上调整灵活文本区域的大小?

在移动设备上调整 SVG 大小