html - CSS - 动态添加时图像看起来不同

Question

我有一个fiddle ，我想动态添加背景图像。我试图像这样传递它:

<div class="card" style="background:url(http://media.comicbook.com/2016/05/captain-america-civil-war-02082016-182755.png), #0a0a0a;">

但是图像的大小与 css 文件中设置的大小不同。我该如何解决这个问题？

Answer 1

如果您在 HTML 样式属性中使用 background，这将覆盖样式指南中定义的所有其他 CSS。

您需要将 !important 放置在 CSS 中的所有背景属性中，例如:

.card {
  background-position: -60px 42px, 0 !important;
  background-repeat: no-repeat !important;
  background-size: 70% 88% !important;
}

已更新 Fiddle 。

希望这有帮助!