Textarea自动高度 [英] Textarea Auto height

问题描述

我想让textarea的高度等于文字的高度（并移除滚动条）

HTML

 < textarea id =note> SOME TEXT< / textarea> 
  

CSS

  textarea＃note {
 width：100％; 
 direction：rtl; 
 display：block; 
 max-width：100％; 
 line-height：1.5; 
 padding：15px 15px 30px; 
 border-radius：3px; 
 border：1px solid＃F7E98D; 
 font：13px Tahoma，cursive; 
 transition：box-shadow 0.5s ease; 
 box-shadow：0 4px 6px rgba（0,0,0,0.1）; 
 font-smoothing：subpixel-antialiased; 
 background：linear-gradient（＃F9EFAF，＃F7E98D）; 
 background：-o-linear-gradient（＃F9EFAF，＃F7E98D）; 
 background：-ms-linear-gradient（＃F9EFAF，＃F7E98D）; 
 background：-moz-linear-gradient（＃F9EFAF，＃F7E98D）; 
 background：-webkit-linear-gradient（＃F9EFAF，＃F7E98D）; 
} 
  

JsFiddle：http://jsfiddle.net/Tw9Rj/

解决方案

可以使用JS来实现。以下是使用解决方案的一行 > elastic.js ：

  $（'＃note'）。请检查此类似的主题：
 
 
 
     使用原型自动调整textarea  
 
 
 
 < a href =http://stackoverflow.com/questions/995168/textarea-to-resize-based-on-content-length> Textarea根据内容长度调整大小 
 
 
 
 使用自动调整大小创建textarea  
 
I want to make height of textarea equal to height of the text within it (And remove the scroll bar)

HTML
<textarea id="note">SOME TEXT</textarea>
CSS
textarea#note {
    width:100%;
    direction:rtl;
    display:block;
    max-width:100%;
    line-height:1.5;
    padding:15px 15px 30px;
    border-radius:3px;
    border:1px solid #F7E98D;
    font:13px Tahoma, cursive;
    transition:box-shadow 0.5s ease;
    box-shadow:0 4px 6px rgba(0,0,0,0.1);
    font-smoothing:subpixel-antialiased;
    background:linear-gradient(#F9EFAF, #F7E98D);
    background:-o-linear-gradient(#F9EFAF, #F7E98D);
    background:-ms-linear-gradient(#F9EFAF, #F7E98D);
    background:-moz-linear-gradient(#F9EFAF, #F7E98D);
    background:-webkit-linear-gradient(#F9EFAF, #F7E98D);
}
JsFiddle: http://jsfiddle.net/Tw9Rj/
解决方案
It can be achieved using JS. Here is a 'one-line' solution using elastic.js:
$('#note').elastic();
Check this similar topics too:

Autosizing textarea using prototype

Textarea to resize based on content length

Creating a textarea with auto-resize

                        
这篇关于Textarea自动高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！