javascript - 具有纯 CSS 内容的初始自动高度的文本区域

Question

我一直在寻找一个简单的 CSS 解决方案来使其内容的 texarea 匹配高度。

我不希望在您键入时自动调整大小的文本区域。我有一个文本区域，其中已经包含文本，我希望它与内容匹配。

有没有办法使用 CSS 来做到这一点？

标签： javascriptjquerycss

Answer 1

不，因为根据定义， atextarea的大小不是根据其内容来确定的。

但是，您可以使用 a<div contenteditable="true"></div>并为其设置样式，使其外观和行为类似于textarea.

.textarea {border:1px solid #e0e0e0; max-height:100px; overflow-y:scroll;}

<div contenteditable="true" class="textarea">jdsklf ;askf; fs;dlfkj sad;flkasdj f;laskfj as;lfkajsd f;lasdkfj asl;dkfj sad;lfkasjd f;laskdjf a;sldfkj asdf;lkasdjf ;lasdkfj asd;lfkjsad f;laksdjf ;alsdkfjs ad;lfkjsad f;lksadjf ;lasdkfjasdl;fk jasdl;fkj asdf;lksadj f;lsadkfj sad;lfkjsd f;lksadjf; lsadkfjsda;lfk jsd;lfk jsdf</div>