带有媒体查询的全高答案

【问题标题】：Full heigth with media queries带有媒体查询的全高
【发布时间】：2013-11-29 01:44:56
【问题描述】：

如何让 div 在我的浏览器上全高？我使用媒体查询来获取我身体的全宽，但在我的身体内，我有 3 个 div，需要始终保持 100% 全高，即使我调整浏览器的大小也是如此。

这就是我用来使主体为 100% 宽度的方法

@media only screen and (min-width:769px)
{

body{
background-color:red;
width: 100%;
margin: 0 auto;
min-width: 800px;
max-width: 1600px;
}

并且该主体内有 3 个 div，我需要始终保持 100% 的高度，我制作它的页面不会有任何向下滚动，始终必须是 100% 的高度和 100% 的宽度

【问题讨论】：

你可以谷歌这个，以前有人问过。以防万一这在 Google 上得到了很高的结果：html 和 body 需要设置为 100%（当然也可以是固定高度），以便将包含的元素设置为百分比高度。
是的，我用谷歌搜索，但我找不到答案（也许我太绝望了，看不到它），非常感谢您的回答

【解决方案1】：

你需要做的是添加这个css：

body, html {
    width: 100%;
    height: 100%;
}
.div-1 {
    height: 100%;
}
.div-2 {
    height: 100%;
}
.div-3 {
    height: 100%;
}

这将使 div 1、2 和 3 的高度始终为浏览器的高度

【讨论】：

【解决方案2】：

尝试定义这个

*, html, body {
    height: 100%;
    width: 100%;
}

它将默认将每个元素定义为 100% 高度，包括您的整个文档正文。

【讨论】：