CSS更改图像容器中的背景颜色

Question

需要一个 CSS 来将图像容器的背景颜色设置为白色。 我认为我的障碍是如何调出要应用 CSS 的特定项目。 以下适用于网站背景，但不适用于图像容器。

body {
  background-color: white;
}

我相信这是我要调整的框对象： document.querySelector("body > div.wrapper > div > div.products.row > div.col-sm-12.col-md-10 > div:nth -child(1) > div.image-wrap")

此处自行车图像上方和下方的灰色条需要为白色而不是灰色： https ://www.hermosacyclery.com/bikes/electra/cruiser-attitude。

谢谢，史蒂夫

Answer 1

您需要直接定位img标签才能应用所需的样式。 您可以添加此 CSS 来解决问题：

    .products .product .image-wrap img {
       background-color: #ffffff; 
    }

Answer 2

除了@Edgar 所说的使用

.products .product .image-wrap img {
   background-color: #ffffff; 
}

您还需要了解 CSS 的“级联”部分。 还有另一个活动的 CSS 条目覆盖了背景颜色。

.slider img,
.products .product .image-wrap img,
.categories .category img, 
.zoombox .images a img, .zoombox .thumbs a img {
  background-color: #f7f7f7;
}

特别是.products .product .image-wrap img,该选择器组的一部分。