让超出浏览器图片适应浏览器居中显示

图片居中很好办，但是如果图片大于浏览器的窗口大小呢，我们要想让图片适应各种浏览器大小，确保图片以直居中，超出浏览器的区域，让两边一起隐藏，始终显示图片中间区域，效果如下图：

代码如下：

#banner {
min-width: 1263px;//图片缩小到最小的尺寸，超过不再缩小
overflow: hidden;//确保浏览器下方不出现横向滚轴
//这两行确保居中
display: flex;
justify-content: center;
}

注明：不要直接在img上设置，要在上一层的容器里设置。