我经常发现在内容外部用.inset-0类设置一个绝对 Package 器很有用。

<!-- this will use the whole viewport even in mobile -->
<div class="absolute inset-0">
    <div>
      lorem ipsum
    </div>
</div>

在应用加载时运行此JavaScript代码
document.documentElement.style.setProperty("--vh", window.innerHeight * 0.01 + 'px');
并将其放在全局样式中以覆盖h-screen类

.h-screen {
    height: 100vh; /* Fallback for browsers that do not support Custom Properties */
    height: calc(var(--vh, 1vh) * 100);
}

问题是h-screen使用100vh作为高度。正如在this question中提到的，100vh的目标是不在移动的设备上工作。
但有一种方法可以欺骗它，但它不会被添加到顺风，因为它需要JS。要了解更多关于这个'把戏'检查这篇文章：The trick to viewport units on mobile

面对同样的问题，发现我们可以使用dvh（动态视口高度）。
h-[calc(100dvh)]而不是h-screen。
但是，最好添加一个备用选项，以防万一。