其实很简单,只需要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;
}

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

关于input输入框内设置小图标的问题的更多相关文章

  1. 清除表单input输入框内数据

    清除表单input输入框内数据 1. $(':input','#addVoucherType') //'#addVoucherType'表单id .not(':button') .val('') .r ...

  2. 在CS代码页获取input输入框内肉----.net学习点滴

    想在后台cs页面得到前台页面aspx中html控件input输入的值.通过访问input输入框的name属性值获取. 解决方法如下: 1.用Request["user"].toSt ...

  3. input输入框type设置为number,maxlength无效

    一个小细节,以前很少注意,直到最近做的一个项目,当我把一个输入数字的input框的类型设置为number时,input框还是可以无限输入,设置maxlengh=10就不起作用了.然后我就去百度了一下, ...

  4. input 输入框背景色设置为透明

  5. js应用中的小细节-时间戳的转换和input输入框有效数字

    1 input输入框内value值保留有效数字,js自带的方法.toFixed(),但是直接使用会报错,因为不论输入框内输入汉字.字母还是数字,类型都是string.解决的办法是将其转换为number ...

  6. css:自己实现一个带小图标的input输入框

    有小图标的input输入框<input type="text" placeholder="输入手机号" style="background:ur ...

  7. 内联/块级元素的宽高及margin/padding的说明 |||||| 为何img、input等内联元素可以设置宽、高

    1,内联非替换元素设置宽高是无效的,设置margin时,左右有效,上下无效.设置padding时,左右有效,而上下padding比较奇葩,内联非替换元素的上下padding会在元素内容盒不动的情况下上 ...

  8. input、textarea等输入框输入中文时,拼音在输入框内会触发input事件的问题

    监听文本输入框的input事件,在拼写汉字(输入法)但汉字并未实际填充到文本框中(选词)时会触发input事件,如图: 但是在很多情况下,只需要输入到输入框的中文字符. 解决办法: 通过查阅资料得知在 ...

  9. Css——设置input输入框光标颜色

    在使用 input 输入框时,我们可能会遇到需要给其设置光标颜色的情况.谷歌浏览器的默认光标颜色是黑色的,GitHub 上的光标却是白色,那么这个用 CSS 怎么改变呢? 上面描述的情景有两种实现方式 ...

随机推荐

  1. 【转】Windows下Python快速解决error: Unable to find vcvarsall.bat

    转自:http://blog.csdn.net/sad_sugar/article/details/73743863 系统配置:Windows10 x64, Visual Studio 2017, P ...

  2. sale.order

    # 初始化一个变量用来记录产品类型line_type = ''# 循环明细行for product in self.options: # 拿到该明细行的产品类型 product_type = prod ...

  3. Windows10 家庭版 关闭Windows defender

    管理员权限打开cmd,输入下面命令: reg add "HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Microsoft\Windows Defender&quo ...

  4. luogu2839 [国家集训队]middle

    题目链接:洛谷 题目大意:给定一个长度为$n$的序列,每次询问左端点在$[a,b]$,右端点在$[c,d]$的所有子区间的中位数的最大值.(强制在线) 这里的中位数定义为,对于一个长度为$n$的序列排 ...

  5. mybatis 转义

    当我们需要通过xml格式处理sql语句时,经常会用到< ,<=,>,>=等符号,但是很容易引起xml格式的错误,这样会导致后台将xml字符串转换为xml文档时报错,从而导致程序 ...

  6. 公众号获取unionid

    然后在微信客户端输入unionid接口的地址(比如发给文件传输助手www.XXX.COM/unionid.php),随便给别人发过去,在点击该链接,就能看到打印的accessToken,openid, ...

  7. 大数据Spark+Kafka实时数据分析案例

    本案例利用Spark+Kafka实时分析男女生每秒购物人数,利用Spark Streaming实时处理用户购物日志,然后利用websocket将数据实时推送给浏览器,最后浏览器将接收到的数据实时展现, ...

  8. 竖倾斜ScrollView

    using UnityEngine; using UnityEngine.EventSystems; public class ObliqueScroll : MonoBehaviour,IDragH ...

  9. Java基础(basis)-----关键字final和static的作用

       1.关键字final      final修饰类:这个类就不能被继承      final修饰方法:不能被重写      final修饰属性:此属性就是一个常量,一旦初始化后,不可再被赋值.习惯 ...

  10. js-cookie的用法

    cookie的作用无需多言,自己封装一个cookie,不停地复制黏贴页颇为麻烦,在这里,有npm为我们封装好的插件js-cookie: https://www.npmjs.com/package/js ...