css - 在 Twitter Bootstrap CSS 中为背景图像覆盖 `background: transparent !important`

Question

我遇到了这个 question 中提到的相同问题，但对于 background-image，该问题的答案只支持用某种纯色而不是图像填充整个 div。

我的情况是，我有一组 div，我给每个不同的 background-image，如下所示:

@media print {
  .AdultDentalChart .tooth .toothImage1 {
    background-image: url("@Url.Content("~/images/DentalChart.png")") !important;
    background-position: 0px 10px;
    -webkit-print-color-adjust: exact;
  }

请记住，我在 Bootstrap 中面临需要覆盖的相同代码

* {
    color: #000 !important;
    text-shadow: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }

Answer 1

您在media print 中有两个@@ 删除其中一个。正如 OP 所评论的那样，这必须归因于正在使用的框架。 - 不是问题。

使用background-image时必须设置width/height

CSS，来自级联，所以 div 必须在通配符选择器 * 之后才能覆盖它。

当然，该演示没有使用 print。

@media {
  * {
    color: #000 !important;
    text-shadow: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  div {
    background-image: url("//dummyimage.com/200x200") !important;
    background-position: 0px 10px;
    -webkit-print-color-adjust: exact;
    height: 200px;
    width: 200px;
  }
}

<div>text</div>