gpt4 book ai didi

html - 将列设置为页面的全高,不超过页面大小

转载 作者:太空宇宙 更新时间:2023-11-04 06:40:13 25 4
gpt4 key购买 nike

我在顶部有一个导航栏,并将 html 和正文设置为 100% 高度,我使用引导网格将页面分成两列,我想设置两列的高度,使其不应超过页面,所以没有滚动条出现

如何设置列高不出现滚动条

最佳答案

您可以在parentgrandparent 等上使用height: 100% 来实现它。你可以在 codepen 上看到一个演示:

https://codepen.io/k-five/pen/gZgwqO

或在这里:

html,body{
height: 100%;
margin: 0; padding: 0; border: none;
}

body > div.parent {
height: 100%;
}
div.parent > span {
display: inline-block; width: 50%;
}
div.parent > span:first-child {

height: 100%; background-color: #F00;
}
div.parent > span:last-child {
height: 100%; background-color: #FF0;
}
<!DOCTYPE>
<html>
<body>

<div class="parent">
<span>1</span><span>2</span>
</div>

</body>
</html>

如果你想使用 bootstrap 看看 https://getbootstrap.com/docs/4.0/utilities/sizing/这是h-100

关于html - 将列设置为页面的全高,不超过页面大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53862746/

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