Question

所以我有一个盒子，我需要显示一些文字，红色背景颜色，并在盒子的右边有一个图像。

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

以下是一个示例，但它会覆盖背景颜色：

.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

Answer 1

你是说这个吗？

.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-repeat和background-position，也可以使用快捷方式background。使用后者时，它将覆盖您设置的特定规则，在本例中为background-color

以下是编辑http://jsbin.com/axohoc/7/edit

的示例

在这里，您可以了解速记属性的具体细节，以及不同的特定背景属性：http://www.w3schools.com/css/css_background.asp

css在同一个div中有背景颜色，文本和图像

1 个答案: