我有一个非常简单的 html 页面,带有一个顶部栏和一个文本区域。我希望文本区域填满顶部栏留下的高度。调整大小后需要自动调整。
例如
<html>
<body>
<div id="top" />
<textarea id="text" />
</body>
</html>
我尝试了很多东西,但我总是得到两个滚动条(一个用于文本区域,一个用于正文)。
最佳答案
如果你有一个固定高度的顶栏,你可以在你的文本区域使用绝对位置来填充剩余的区域,如下所示:
body {
margin: 0;
}
#top {
color: #ffffff;
background: #333399;
height: 50px;
padding: 10px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#text {
position: absolute;
top: 50px;
bottom: 0;
left: 0;
right: 0;
width: 100%;
padding: 10px;
margin: 0;
resize: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
<div id="top">Top</div>
<textarea id="text">Textarea</textarea>
关于javascript - 如何扩展文本区域以填满页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25880903/