contenteditable元素的placeholder键入提醒语设定方式

2020-10-16 11:45 jianzhan

在一些状况下,textarea是不足用的,大家还必须显示信息1些标志或高亮度元素,这就必须用富文字编写器,而富文字编写器实质上是HTML元素设定了contenteditable。

随后将会必须像input、textarea有placeholder的键入提醒语,但contenteditable的元素,placeholder是没用的,必须此外方法。

事例:

HTML:

<div class="con" contenteditable="true"></div>

CSS:

.con{
    width: 400px;
    height: 400px;
    border: 1px solid #4ec844;
    outline: none;
}
.con:empty:before{ 
    content: '说点啥好呢?'; 
    color: gray; 
} 
.con:focus:before{
    content:none;
}

:empty访问器适配性

PS::focus适配性也是类似的

总结

以上所述是网编给大伙儿详细介绍的contenteditable元素的placeholder键入提醒语设定方式,期待对大伙儿有一定的协助,假如大伙儿有任何疑惑请给我留言,网编会立即回应大伙儿的。在此也十分谢谢大伙儿对脚本制作之家网站的适用!