我想知道是否有可能摆脱垂直滚动有3行在移动设备上查看，应该适合拉伸到屏幕的高度，当屏幕高度小于应该的高度时就会收缩，所以如果有一个较高的设备，所有的元素将按比例增长以适应整个屏幕的高度，而不是每次当容器的元素的高度之和大于屏幕的高度时出现滚动条。我应该使用什么属性？谢谢你。
你可以做到这一点与CSS Flexbox。我发布一个例子，我相信创建你想要的效果。
在HTML中有三行（头，主，脚）包裹在一个div内。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<div>
<header>
<p>Header</p>
</header>
<main>
<p>Main</p>
</main>
<footer>
<p>Footer</p>
</footer>
</div>
</body>
</html>
和CSS。
html, body {
margin: 0;
padding: 0;
}
div {
display: flex;
flex-flow: column nowrap;
height: 100vh;
}
header {
background-color: lightblue;
flex: 1 1;
}
main {
background-color: lightcyan;
flex: 1 1;
}
footer {
background-color: lightgreen;
flex: 1 1;
}
你可以使用CSS网格，设置一个有3行的模板，并设置每个行元素的高度为33.33333%。这样可以确保元素占据整个屏幕。