关于input输入框内设置小图标的问题

最新推荐文章于 2024-06-18 17:03:40 发布

weixin_30763455

最新推荐文章于 2024-06-18 17:03:40 发布

阅读量6.1k

点赞数 2

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/lxl0419/p/9052602.html

版权

其实很简单，只需要html和css就可以搞定啦

首先：<input class="layui-input" id="test1" placeholder="yyyy-MM-dd" type="text" >

写好input标签后就看css大显身手了

#test1{
background-image: url(icon/calendar.png);/*设置小图标为背景*/
background-size:18px 18px;/*设置小图标的大小*/
background-position: 130px 0px;/*设置小图标的位置*/
background-repeat:no-repeat ;/*设置小图标不重复*/
border: 1px solid gray;
}

然后打开页面就可以看到想要的效果啦!

转载于:https://www.cnblogs.com/lxl0419/p/9052602.html