html:<div class='item'><div class = 'container' /></div>
css:.item {width: 100%;height: 100%;.container {max-width: 100%;height: auto;min-height: 600px; // 这里可监听屏幕变化,改变最小高度 position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%); // 利用位移实现居中 background-image: url(./img/1.png);background-size: 100%;background-repeat: no-repeat;background-position: center 0;}}
如果觉得《背景图自适应屏幕居中显示 且不变形》对你有帮助,请点赞、收藏,并留下你的观点哦!