css如何在input中插图片-创新互联
这篇文章主要介绍css如何在input中插图片,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
为呼玛等地区用户提供了全套网页设计制作服务,及呼玛网站建设行业解决方案。主营业务为成都网站设计、做网站、呼玛网站设计,以传统方式定制建设网站,并提供域名空间备案等一条龙服务,秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求,就会得到认可,从而选择与我们长期合作。这样,我们也可以走得更远!css在input中插图片的方法:首先在包含input的div中设置子元素;然后设置外层div定位为relative;接着设置span定位为absolute;最后给input添加margin-left属性即可。
css在input里插图片
1、在包含input的div中设置子元素
2、设置外层div定位为relative
.search{ position: relative; }
3、设置span定位为absolute,并设置宽高和背景图片
.search > span{ position: absolute; display: inline-block; width: 20px; height: 20px; background: url(./search.png) no-repeat; background-size: 80% 80%; background-position: center; }
4、给input添加margin-left属性。
.search > input{ width: 100%; padding-left: 20px; }
5、效果图
以上是“css如何在input中插图片”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联行业资讯频道!
当前标题:css如何在input中插图片-创新互联
URL地址:http://azwzsj.com/article/pjeso.html