本文主要介绍了HTML在透明输入框中添加图标的实现代码。代码简单易懂，对大家的学习或者工作都很有好处。请各位朋友参考。
最近在写一个网站，有律师推荐前台。上面的搜索框有问题。我想把搜索图标放在搜索框里，但很久都没用.
话不多说，直接进入主题：
基本想法
事实上，将输入框和它后面的图标放在一个div中，然后将输入框的边框设置为0px，最后将div的边框设置为最终的外部边框
我们最直接地编码：
HTML:
div class='search '
form action=http://baidu.com
输入类型='文本'占位符='请输入您要找的律师或专业'
n唐山百度优化bsp跨度
a href=' # ' img src=' img/icon 1 . png ' alt=' '/a
/span
/form
/div
CSS:
这里是设置整个div的风格外。搜索{
width: 250px
height: 35px
border: 1px纯白色；
border-radius : 30px；
}
这里是设置里面输入框的长度和宽度，boder为0px，里面的字体大小，点击时边框不亮(outline:none)
这里使用的是Set transparency rgba()，最后一个属性是transparency(介于0和1之间)
输入{
宽度： 200 px；
height: 35px
border : 0；
font-size : 14px；
outline:无；
背景-color: rgba(255，255，255，0)；
color:白色；
font-size : 16px；
margin: 0 10px
总结
本文介绍了html在透明输入框中添加图标的实现代码。有关HTML透明输入框图标的更多信息，请搜索Script House以前的文章或继续浏览下面的相关文章。希望大家以后多多支持脚本屋！
