縮放螢幕的時候banner被壓縮變形!
阿新 • • 發佈:2018-12-26
大家在做專案的時候有沒有遇到一個問題呢 就是一張圖片寬度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