场景
. 在展示一段文字的时候 不希望占用太多的空间;这时候自然就想到了textarea
. 但是textarea只是展示纯文本
. 综上使用div实现textarea的功能
解决
. contenteditable 元素是否可以编辑
. div加上一些样式会好看一些
<div class="textarea" contenteditable="true">
// 填充html标签
</div>
.textarea {
width: 100%;
min-height: 120px;
max-height: 300px;
margin-left: auto;
margin-right: auto;
padding: 3px;
outline: 0;
border: 1px solid #a0b3d6;
font-size: 12px;
line-height: 24px;
word-wrap: break-word;
overflow-x: hidden;
overflow-y: auto;
border-color: rgba(82, 168, 236, 0.8);
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
}