我想知道如何创建一个具有自动调节高度的文本输入，以便它变得更高以适合您的文本？例如，如果我开始输入一个段落，它会从几行扩展以适应该段落。
这是我目前得到的：
#commenttext {
width: 413px;
min-height: 22px;
max-height: 100%;
display: inline;
font-size: 11px;
color: #777777;
word-wrap: break-word;
font-family: "Open Sans", "Tahoma";
top: 7px;
position: relative;
left: 7px;
padding-left: 7px;
}<form action="" method="POST">
<input type="text" id="commenttext">
</form>但这只是一个普通的文本区域。
当我键入更多行时，如何使该文本区域变得更高？我需要Javascript吗？
这是一个纯 CSS 的解决方案：将 a divwith contenteditableset 设置为 true。
<div contenteditable="true"
style="width:200px;min-height:20px;border:1px solid #ccc;"></div>
有关示例，请参阅此JSFiddle。
编辑：
如果您希望能够提交此文本，则需要一些 javascript 将其放入input字段中。将此添加到您的表单中：
<form onsubmit="document.getElementById('hidden_data').value=document.getElementById('showing_data').innerHTML;">
<input id="hidden_data" name="data" type="hidden"/>
<div id="showing_data" contenteditable="true"
style="width:200px;min-height:20px;border:1px solid #ccc;"></div>
</form>
这会将 的内容div放入隐藏input字段中，以便将其POST与其他任何内容一起提交给服务器。
有关示例，请参阅此（更新的）JSFiddle。