textarea不解析html && div替代textarea

场景

. 在展示一段文字的时候 不希望占用太多的空间;这时候自然就想到了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);
        }

猜你喜欢

转载自blog.csdn.net/cominglately/article/details/80198881