Html 文本区域高度：100%
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11089540/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Textarea height: 100%
提问by larin555
Here's my fiddle: http://jsfiddle.net/e6kCH/15/
这是我的小提琴：http: //jsfiddle.net/e6kCH/15/
It may sound stupid, but I can't find a way to make the text area height equal to 100%. It works for the width, but not for height.
这听起来可能很愚蠢，但我找不到使文本区域高度等于 100% 的方法。它适用于宽度，但不适用于高度。
I want the text area to resize depending of the window size...like it works in my fiddle for the width...
我希望文本区域根据窗口大小调整大小......就像它在我的小提琴中工作的宽度......
Any ideas?
有任何想法吗？
回答by jsalonen
Height of an element is relative to its parent.Thus, if you want to make expand your element into the whole height of the viewport, you need to apply your CSS to htmland bodyas well (the parent elements):
元素的高度是相对于其父元素的。因此，如果要将元素扩展到视口的整个高度，则需要将 CSS 应用到html和body（父元素）：
html, body {
height: 100%;
}
#textbox {
width: 100%;
height: 100%;
}
Alternative solution with CSS3: If you can use CSS3, you can use Viewport percentage unitsand directly scale your textbox to 100 % height (and 100% width) of the viewport (jsfiddle here)
CSS3 的替代解决方案：如果您可以使用 CSS3，则可以使用视口百分比单位并直接将文本框缩放到视口的100% 高度（和 100% 宽度）（此处为 jsfiddle）
body {
margin: 0;
}
#textbox {
width: 100vw;
height: 100vh;
}
