gpt4 book ai didi

html - 如何在 HTML/CSS 中设置百分比高度值

转载 作者:行者123 更新时间:2023-11-28 19:20:41 25 4
gpt4 key购买 nike

我正在尝试设置 <div>在 CSS 中达到一定百分比的高度,但它只是保持与其中内容相同的大小。当我删除 <!DOCTYTPE html>然而,它有效,<div>根据需要占据整个页面。我想让页面通过验证,我该怎么做?

我在 <div> 上有这个 CSS ,其 ID 为 page :

#page {
padding: 10px;
background-color: white;
height: 90% !important;
}

最佳答案

I am trying to set a div to a certain percentage height in CSS

什么的百分比?

要设置百分比高度,其父元素 (*) 必须具有明确的高度。这是不言而喻的,因为如果您将高度保留为 auto ,该 block 将采用其内容的高度...但是如果内容本身具有以父级的百分比表示的高度,则您已经使自己有点第 22 条军规。浏览器放弃并仅使用内容高度。

所以 div 的父级必须有一个明确的 height属性(property)。虽然如果您愿意,该高度也可以是百分比,但这只会将问题提升到一个新的水平。

如果你想让 div 高度成为视口(viewport)高度的百分比,div 的每个祖先,包括 <html><body> , 必须有 height: 100% , 所以有一个明确的百分比高度链向下到 div。

(*:或者,如果 div 已定位,则为“包含 block ”,它也是要定位的最近的祖先。)

或者,所有现代浏览器和 IE>=9 都支持相对于视口(viewport)高度 (vh) 和视口(viewport)宽度 (vw) 的新 CSS 单位:

div {
height:100vh;
}

请在此处查看 more info .

关于html - 如何在 HTML/CSS 中设置百分比高度值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57372684/

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