Html Textarea垂直调整大小以包含5000个字符

Question

大家好我在html中有一个Textarea，其容器的宽度为100％，有没有什么方法可以修改Textarea的高度以适应5000个字符，而不使用任何仅使用Css的滚动条？

我已将Css设为

textarea {
    font-family: inherit;
    width: 100%;
    top:0;
    left:0;
    right:0;
    bottom:0;
    resize: vertical;
    box-sizing: border-box; /* For IE and modern versions of Chrome */
    -moz-box-sizing: border-box; /* For Firefox                          */
    -webkit-box-sizing: border-box; /* For Safari                           */
}

编辑：我的宽度为100％，这使得textarea适合100％的屏幕尺寸/容器 因此，如果屏幕的宽度为800px且字体为12px，我希望设置textarea的高度，使其可容纳5000个字符。

Answer 1

由于您在textarea标记中具有属性max length，因此限制字符并不复杂。

假设您的textarea需要5000个字符，您将使用下一个代码：

<textarea rows="4" cols="50" maxlength="5000">
   Enter text here...
</textarea>

因此，您可以告诉我在textarea标记内添加了 maxlength 属性并将其设置为5000。

因此，在设置了最大长度之后，您可能只需在CSS中添加替代方法以保持滚动并使高度匹配为5000：

textarea{
 overflow: hidden;
 height: auto;
}

Answer 2

只用CSS？我会毫不犹豫地回答：不。