html – 使用CSS在移动浏览器上的100％高度

概述我正在我的网站上工作,我希望它在移动设备上看起来非常简单,基本上只有三个部分,每个部分应该适合窗口宽度和高度 <section style="width: 100%; min-height: 100%"></section> 它在我的计算机浏览器设备模式下看起来很完美,但是当我在我的手机(iPhone)上打开它时,url bar出现问题,随着我们向下滑动,它会变小.在页面加载时,最小高度适应浏 我正在我的网站上工作,我希望它在移动设备上看起来非常简单,基本上只有三个部分,每个部分应该适合窗口宽度和高度

<section ></section>

它在我的计算机浏览器设备模式下看起来很完美,但是当我在我的手机(iPhone)上打开它时,url bar出现问题,随着我们向下滑动,它会变小.在页面加载时,最小高度适应浏览器高度(包括条形),当条形更改其尺寸时,它不会更改.所以它不再适合屏幕了.我试过这个：

<Meta name="vIEwport" content="height=device-height">

但是,显然,部分很高.可能我可以在j@R_404_5962@中做一些解决方法,但我宁愿不这样做.我希望CSS中有一些简单的解决方案.
感谢您的时间.
如果你想看到它：http://kacpergalka.nazwa.pl/_portfolio

解决方法 您可以在最小高度样式中尝试vh(视口高度)单位.

<section ></section>

另一种选择是使用calc().

<section ></section>

总结

以上是内存溢出为你收集整理的html – 使用CSS在移动浏览器上的100％高度全部内容，希望文章能够帮你解决html – 使用CSS在移动浏览器上的100％高度所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。