div 可编辑及placeholder设置并且可以去掉默认边框

最新推荐文章于 2024-05-20 16:58:10 发布

转载最新推荐文章于 2024-05-20 16:58:10 发布 · 1.1k 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/vsmart/p/6400770.html

本文介绍了一种利用CSS伪元素:before实现内容占位及动态显示效果的方法，适用于输入框默认提示文字的美观展示，当输入框获得焦点时默认文字自动消失。

样式：

/*为空时显示 element attribute content*/
.ipt:empty:before{
　　content: attr(placeholder); /* element attribute*/
　　/*content: 'this is content';*/
　　color:#ddd;
}
/*焦点时内容为空*/
.ipt:focus:before{
　　content:none;
}
.ipt:focus{
　　border: none;outline:none;
}

转载于:https://www.cnblogs.com/vsmart/p/6400770.html