1

我想在输入文本框的背景中显示图像。图像应放置在输入文本框的最右侧中心部分。可以通过以下代码轻松完成：

    <input type="text" class="card" size=20 />

CSS将是：

    .card{
     background:url('image.png') no-repeat right center;
       }

我面临的问题是图像是一个精灵，由 3 个图像组成。我想在背景位置 -34px 0 显示一个，它的宽度是 23px；

如何用css指定背景位置和大小？

提前致谢！！

4

1 回答 1

2

如果精灵很紧，您不能在 CSS 中剪切背景，其他选项是在输入框旁边添加一个跨度并将背景设置为精灵以及正确的高度和宽度，然后使用背景位置来获取正确的图像，一旦完成，您就可以使用负左值定位跨度，将其拉到文本框的左侧，希望这会有所帮助:)

<div style="position:relative; display:inline-block;">
  <input type="text" /><span style="position:absolute; right:0px; background:#FF0000">O</span>
</div>
于 2012-05-08T09:58:48.243 回答