是否可以仅使用CSS为输入文本和文本区自动调整大小或自动增长？

Question

James Padolsey's和ahaxe's jquery脚本是自动增长表单域的两个非常好的实例。

同样，使用Javascript可以通过多种方式实现自动调整大小。

但是，只是想知道，有没有任何一种方式的自动大小或自动增长只使用CSS？我对CSS的了解还不够深，所以你知道，有了那些伪类和CSS3，我猜这是可能的。

或者可能唯一的选择是使用<input size>或style="width: em;"...

Answer 1

在元素上使用contenteditable属性，然后根据您喜欢的in the css对其进行自定义

<div contenteditable="true"></div> 

Answer 2

不，你不能。真的。它只能使用JavaScript来完成。

Answer 3

您可以将div-element转换为contentEditable。它的行为方式与textarea相同，但好处是您只需要使用CSS而不是各种插件。

$(<selector>).attr(contentEditable, 'true');

在CSS中，你可以设置min-height，max-height，甚至-webkit-transition属性来实现动画效果。不要忘记将word-wrap属性设置为break-word，这样单词就会保留在元素中。