码迷,mamicode.com
首页 > 其他好文 > 详细

缩放屏幕的时候banner被压缩变形!

时间:2018-12-26 11:42:10      阅读:99      评论:0      收藏:0      [点我收藏+]

标签:实现图   解决   position   nbsp   dde   margin   div   一个   over   

大家在做项目的时候有没有遇到一个问题呢    就是一张图片宽度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被压缩变形!

标签:实现图   解决   position   nbsp   dde   margin   div   一个   over   

原文地址:https://www.cnblogs.com/liAnran/p/10177919.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!