大家在做項目的時候有沒有遇到一個問題呢 就是一張圖片寬度100% 在縮放屏幕的時候圖片會被壓縮變形！！！那麽怎麽才能實現圖片始終居中而不被壓縮變形呢？ 接下來讓我帶領大家解決這個問題 請看代碼↓↓↓↓↓↓↓

<div class=‘bannerbox‘>
  <div class=‘banner‘>
      <img src="../assets/01.jpeg">
   </div>
</div>

下面是css：

.bannerbox { 

                  width:100%; 

                  position:relative; 

                  overflow:hidden; 

                  height:500px;

             } 

          .banner { 

                 width:1920px;/*圖片寬度*/ 

                 position:absolute; 

                 left:50%; 

                 margin-left:-960px;/*圖片寬度的一半*/

  }
 

摘自：https://www.cnblogs.com/chenchenhao/p/9889628.html

縮放屏幕的時候banner被壓縮變形！