1

所以我有一个框，我需要在其中显示一些文本，具有红色背景色，并且在框的右侧还有一个图像。

这个想法是文本应该被优先考虑，背景颜色应该仍然是红色。

这是一个示例，但它覆盖了背景颜色：

.test {
  background-color: #e64e56;;
  box-shadow: 3px 3px 5px darkGray;
  color: white;
  background: url(http://thumb10.shutterstock.com/thumb_small/536008/103572833/stock-photo-small-flower-isolated-on-white-background-103572833.jpg) no-repeat top right;

}

http://jsbin.com/axohoc/1/edit

4

1 回答 1

3

你是这个意思吗？

.test {
  box-shadow: 3px 3px 5px darkGray;
  color: white;
  background: #e64e56 url(http://thumb10.shutterstock.com/thumb_small/536008/103572833/stock-photo-small-flower-isolated-on-white-background-103572833.jpg) no-repeat top right;
}

您可以单独定义background-color、和background-image，也可以使用快捷方式。使用后者时，它会覆盖您设置的特定规则，在这种情况下background-repeatbackground-positionbackgroundbackground-color

这是示例，已编辑http://jsbin.com/axohoc/7/edit

在这里您可以阅读速记属性的详细信息，以及不同的特定背景属性：http ://www.w3schools.com/css/css_background.asp

于 2013-07-05T16:41:23.543 回答