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

时间:2016-06-26 11:23:43

标签: css twitter-bootstrap twitter-bootstrap-3 background-image

我遇到了question中提到的相同问题,但对于background-image,该问题的答案仅支持使用某种纯色而不是图像填充整个div。< / p>

我的情况是,我有一组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; } ,如下所示:

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

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

GCM

1 个答案:

答案 0 :(得分:2)

@@中有两个media print删除其中一个。正如OP所评论的那样,这与使用中的框架有关。 - 不是问题

使用width/height

时,您必须设置background-image

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>