如何将div高度设置为用户监视器分辨率的100%？

Question

height: 100%在CSS中显然不起作用.那么这个问题还有其他CSS或JavaScript/jQuery解决方案吗？请指教.

Answer 1

'让我们说你的问题元素是一个<div>.如果你确定你<div>的身高可以参考,几乎你所有的问题都会消失:

#my_div
{
  height: 100%; /* Won't work. What is 100% of an unknown/unset value? */
}

确保<div>父母的身高也有.我通常这样做(嗯,不完全是,但你明白了):

#my_div, #parent_of_the_div, body, html
{
  height: 100%; /* This works, but it will show scrollbars if the body
                   or html elements have padding or margins. */
}

Answer 2

所以你想要一个div作为屏幕的高度？这有点不明显,但css高度是正确的方法.诀窍是你需要让html和body元素占据页面的整个高度,否则div占据了100%的空间.我发现这样做的最好方法是:

html {
    height: 100%;
}

body {
    height: 100%;
}

#contentDiv {
    min-height: 100%;
}