html之在文本字段中放置图像
arxive
阅读:1520
2023-11-05 18:46:41
评论:0
我有一个这样的 HTML 输入字段。我想在右侧的文本框中放置一个图像。有人可以帮我解决它的 CSS 问题吗?
<input type="text" id="name"/>
图中是文本字段电子邮件地址内的图像,这就是我想要的。你是怎么做到的?
请您参考如下方法:
HTML
<div class="fake-input">
<input type="text" />
<img src="http://www.zermatt-fun.ch/images/mastercard.jpg" width=25 />
</div>
CSS
.fake-input { position: relative; width:240px; }
.fake-input input { border:none; background-color:#fff; display:block; width: 100%; box-sizing: border-box }
.fake-input img { position: absolute; top: 2px; right: 5px }
工作演示
声明
1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。