Question

我目前有一个图像覆盖了一些屏幕分辨率，但是如果屏幕分辨率比图像大，那么每个像素的白色会更大，所以不是那个丑陋的白色，我想要背景图像背后的颜色所以它看起来不丑。我当前的代码只是背景的img标签，css将其缩放到100％，但如果屏幕res大于图像res，则会产生问题。

Answer 1

您是否有特定原因使用img标记作为背景图片，而不是设置div以将其作为该图像的背景？因为你可以很容易地用css做到这一点。

.background-div {
  width: 100%;
  height: 100%;
  background: url(your_image_url) no-repeat;
  background-size: cover;
  background-color: #e3e3e3;
}

.background-div代替你的img ...这也可能是文档的body，或者其他什么。它只是一个涵盖整个背景的容器div。

背景的后备颜色为＃e3e3e3，background-size: cover表示它将始终缩放图像以填充屏幕，因此您无法看到该颜色。您也可以使用contain代替，这会使图像缩放您的预期，并显示图像无法到达的背景色。

Answer 2

找到图像的父div并添加样式表属性。

它看起来像这样

<div class="parent" style="background-color: #000000;height: 100%;width: 100%;">
<img src="your image url" class="image" alt="alt" title="your title"/>
</div>

attr style =“background-color：＃000000;”将给div一个黑色的背景色。

您还可以通过其classname为style.css文件设置背景颜色。或者你把文件命名为什么。

.parent {
     background: #000;
     height: 100%;
     width: 100%;
}

.parent img {
     max-width: 100%;
}

我希望这是你寻找的灵感。如果没有，请提供更多详细信息。也许显示当前代码的结构。

如果背景图像没有加载，请具有备用背景

2 个答案: