简易 div 输入框
HTML5规范引入了 contenteditable 属性,它几乎可以用在任何元素上,只要添加这一属性 即可变为可编译区域。查看详情
一个简单的 <div>
输入框:
<style>
.editdiv{
min-height: 50px;
background: #eee;
/*
清除编辑器获取焦点时的默认样式:
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-user-modify:read-write-plaintext-only;
outline:none;
*/
/* 设置光标颜色:*/
caret-color: green;
/* 防止全局设置 -webkit-user-select: none 后不会获取焦点 */
-webkit-user-select:text;
}
/* 设置提示文字 */
.editdiv:empty::before {
content: attr(placeholder);
color: #999;
}
.editdiv:focus::before {
content: none;
}
</style>
<div contenteditable="true" class="editdiv" placeholder="请输入......">