<div id="loadingScreen" style="display: none"> <div class="demo" id="id-demo"> <img src="./images/loadingBg.png"></img> <div class="container" style="position: absolute; width: 100%; bottom: 5%"> <div class="row"> <div class="col-md-offset-3 col-md-6"> <div class="progress"> <div class="progress-bar progress-bar-danger progress-bar-striped active" id="id-progress1" style="width: 0%;"> <div class="progress-value" id="id-progress2">0%</div> </div> </div> </div> </div> </div> </div> </div>怎么使这个图片适配所有分辨率

要让这个图片适配所有分辨率，可以采用以下方法：

1. 使用CSS的background-size属性来控制图片的大小，可以将其设置为 cover 或 contain，让图片自适应容器大小。

2. 使用CSS的max-width属性来限制图片的最大宽度，这样可以让图片在不同分辨率下自适应缩放，避免图片过大导致页面布局错乱。

下面是示例代码：

<div id="loadingScreen" style="display: none">         
  <div class="demo" id="id-demo">             
    <div class="container" style="position: absolute; width: 100%; bottom: 5%">             
      <div class="row">               
        <div class="col-md-offset-3 col-md-6">                 
          <div class="progress">                   
            <div class="progress-bar progress-bar-danger progress-bar-striped active" id="id-progress1" style="width: 0%;">                     
              <div class="progress-value" id="id-progress2">0%</div>                   
            </div>                 
          </div>               
        </div>             
      </div>             
      <img src="./images/loadingBg.png" style="max-width: 100%; height: auto;"></img>
    </div>         
  </div>       
</div>

在上面的示例代码中，我们将图片的宽度设置为最大宽度，高度自适应，这样可以让图片在不同分辨率下自适应缩放，同时保持页面布局的稳定。