问

将图像放在文本字段中

你问什么只为她停留_538 发布于 2023-02-08 15:10

html

input

text

图片

我有一个像这样的HTML输入字段.我想在右侧的文本框中放置一个图像.有人可以帮我解决这个问题吗？

在图片中是文本字段电子邮件地址内的图像,这是我想要的.你怎么做到这一点？

2 个回答

试试这个:

input { 
  background-image: url("icon.png");
  background-position: right top;
  background-repeat: no-repeat;
  background-size: contain;
}

2023-02-08 15:13 回答

迷失港湾的豪

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 }

工作演示

http://jsfiddle.net/HnJZa/

2023-02-08 15:13 回答

残念易_138

撰写答案

今天，你开发时遇到什么问题呢？

立即提问

热门标签