今天看到有人在問能不能實現手機輸入框的高度隨著文字增多而增長，到手機頂部的時候再增加內容，出現滾動條。
textarea 的高度是固定的，內容超出就會出現滾動條，使用js控制的話效果不是很理想，所有準備使用div來模擬 textarea，這就要不得不提html5的乙個新屬性 contenteditable
<div
id="textarea"
contenteditable
="true"
>
div>
contenteditable 顧名思義就是內容可編輯，使用之後div的內容就可以編輯了，為了實現跟 textarea 一樣的顯示效果，我們只需要對div的樣式進行設定一下就行。
#textarea
另外這個方法還可以實現，在div內部改變部分字型的樣式，顏色等，是不是很方便。
div模擬textarea文字域輕鬆實現高度自適應
因為textarea不支援自適應高度，就是定好高度或者是行數之後，超出部分就會顯示滾動條，看起來不美觀。而用div來模擬時，首先遇到的問題是 div怎麼實現輸入功能？可能我們還是第一次見到這個屬性contenteditable，如乙個普通的block元素上加個contenteditable true...
div模擬textarea實現高度自增長
h5提供了乙個屬性 contenteditable 使得div充當文字輸入不再是夢想 以下是div實現文字輸入的簡單demo div id textarea contenteditable true div css樣式 textarea在vue中如何獲取div中的內容 div id textarea...
div模擬textarea以實現高度自適應例項頁面
使用很簡單，乙個普通的block元素上加個contenteditable true 就ok了，如下 true外面的引號甚至去掉都沒關係。contenteditable屬性雖是html5裡面的內容，但是ie似乎老早就支援此標籤屬性了。所以，相容性方面還是不用太擔心的。ok，最麻煩的模擬textarea...