0

我有一个通过背景图像格式化的文本框。现在，当一些 AJAX 处理发生时，我想在文本框的右下角显示一个旋转图标。发生这种情况时，我可以将类添加到文本框中，但它显然会替换背景。

.suburb-loading {
background: url('/images/loading_spinner.gif') right center no-repeat;
}

他们是一种叠加 2 个背景的方法吗？或者在这里将图像覆盖在背景上的最佳方法是什么？

4

2 回答 2

1

使用 CSS 多个背景，只需用逗号分隔它们

.suburb-loading {
   background-image: url('1.png'), url('2.png');
   background-repeat: no-repeat, no-repeat;
}

演示

小提琴 CSS

input {
    background-image: url('http://www.melabev.org/images/spinner.gif?1331633304'), url('http://1-art.eu/images/backgrounds/vellum/vellum-old-vellum-background2.jpg');
    background-repeat: no-repeat, no-repeat;
    background-position: center right, 0 0;
    height: 35px;
}
于 2013-05-04T03:56:51.373 回答
0

您可以使用CSS3 多背景功能，但您应该知道这不适用于所有浏览器，或者您可以创建另一个div覆盖原始浏览器，like with absolute position这适用于不支持多背景的旧浏览器

于 2013-05-04T03:59:53.677 回答