你可以不为div设置背景img，而是在div内添加一个img，使其拉伸到div的大小，然后使用z索引使其显示为背景图像（确保包括相对位置，否则z索引将不起作用）。如果图像与div大小相同，则设置div的背景是很好的，否则它看起来永远不正确。

<style>
      .background-img {
          height: 100%;
          width: 100%;
          position: relative;
          z-index: -1;
     }
   </style>
   <div> 
     <img src='/your-image' class='background-img'/>
   </div>

或者，您可以在示例中尝试的一个解决方案是在样式中添加背景大小的封面。

<div style="background-image:      url('C:/MyFolder/MyImage.jpg'); background- repeat:no-repeat; height:200px; width:100%; image-rendering: -webkit-optimize-contrast; background-size:cover"> </div>

希望这个看起来更好

• • 解决方案1：**

如果您可以轻松地将div替换为img标记，那么您的代码将变为

<img src="your-image.jpg" class="customImgSize"/>

然后应用如下样式

.customImgSize {
     width: auto;
     height: 200px; /* your custom height */
    }

• • 解决方案2：**

您可以使用img标签来实现这个结果，然后用div Package img标签。

<div class="imgContiner">
      <img src="your-path-to-image" class="flexibleImg"/>
    </div>

你的CSS变成了

.imgContainer {
      width:auto; 
      /* you can use max-width/min-width to define the widths for all */ 
      resolutions
    }

    .flexibleImg {
      width: auto;
      height: 200px; /* Apply your height */
    }