不改变图片大小，使图片居中的办法

一、运用背景图像

<style>
#tt {
    height: 400px;
    border: 1px solid #e6e6e6;
    background-image: url(../images/anquan/2.png);
    background-position: center top;
    margin-top: 15px;
}
</style>
<div id="tt"> </div>

 

二、运用calc（）：自动计算屏幕大小

<style>
#tt {
  background-color:#FF0000;
  width: 100%;
  height:500px;
  overflow: hidden;
}
#tt .img
{
  width:1920px;
  margin:0 calc(50% - 960px);
}
</style>
 
<div id="tt"><img src="http://b.zol-img.com.cn/desk/bizhi/image/5/1920x1080/1418984437613.jpg" class="img"/></div>

效果前后如图

     

转载于:https://www.cnblogs.com/jingzi111/p/5050303.html