如何用div模拟input 的作用

用div 模拟input

1、如果用div模拟input 那input的placeholder怎么办? div是不支持placeholder属性的 那么如何实现内容为空的时候显示一个默认的文字呢?


<span style="font-family:Simhei;"></span>
<div class="input"   contenteditable    placeholder="请输入文字"></div>



.input{
    width:200px;
    height:24px;
    line-height:24px;
    font-size:14px;
    padding:5px 8px;
    border:1px solid #ddd;
}

.input:empty::before{
      // content 内容有两种:a、固定的字符串‘ddd’   b、 attr(元素属性)
    content: attr(placeholder)
}

使用css伪元素需要注意什么?

猜你喜欢

转载自my.oschina.net/u/3608045/blog/1673103