gpt4 book ai didi

html - 平板电脑的全高页面,无垂直滚动且适合一个屏幕的内容

转载 作者:行者123 更新时间:2023-11-28 17:08:17 24 4
gpt4 key购买 nike

好的,我会尽力解释我想要实现的目标,因为我不允许在堆栈中添加图像,所以这里是:

我有一个平板电脑的设计。整个内容占据了设计的 100% 高度,顶部和底部只有 15px 的填充。

因此,我必须使设计适合市场上所有可用的应用程序,而无需垂直滚动。

我尝试过很多解决方案,比如使用 bootstrap

HTML

<html>
<body>
<div class="main-content">
</div>
</body>
</html>

CSS

html, body, main-content {
height:100%;
overflow:hidden;
}

此外,我尝试使用媒体查询减小页面中元素的大小,以便垂直适应不同平板电脑的屏幕。

问题是,设计中大约有 80 个页面,我认为这不是处理如此多的页面以及为每个页面添加媒体查询的最佳解决方案。 (各页面设计不同,不能使用通用类)

想知道是否有任何其他解决方案来适应没有滚动的平板电脑的页面高度。

任何帮助,建议将不胜感激。

最佳答案

试试这个,

html, body, main-content {
height:100vh;
overflow:hidden;
}

关于html - 平板电脑的全高页面,无垂直滚动且适合一个屏幕的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29821073/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com