如何在输入字段后添加字体图标？
发布于2023-09-17 19:11 阅读(1040) 评论(0) 点赞(11) 收藏(0)
我有这个代码：
<div class="form-group">
<label for="site-title">Site title<span style="color: red;">*</span></label>
<input class="form-control" type="text" value="" id="site-title" name="" required> <a href="#" data-toggle="tooltip" data-placement="top" title="Tooltip on top"><i class="mdi mdi-information-outline"></i></a>
</div>
我想在输入字段后面添加一个字体图标，但它当前显示在输入字段下方。
如何将其放置在字段之后？
解决方案
你可以尝试类似的东西
.input-container { display: -ms-flexbox; display: flex; width: 100%; margin-bottom: 15px; } .icon { padding: 10px; background: dodgerblue; color: white; min-width: 50px; text-align: center; } .input-field { width: 100%; padding: 10px; outline: none; }
使用 CSS 可以更轻松地对齐页面上的项目。请参阅 W3Schools 教程 - 它简单易懂https://www.w3schools.com/howto/howto_css_form_icon.asp
所属网站分类: 技术文章 > 问答
作者：黑洞官方问答小能手
链接：http://www.qianduanheidong.com/blog/article/531469/63ebd47012a91ff7f142/
来源：前端黑洞网
任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任
昵称:
评论内容：(最多支持255个字符)
---无人问津也好，技不如人也罢，你都要试着安静下来，去做自己该做的事，而不是让内心的烦躁、焦虑，坏掉你本来就不多的热情和定力