响应式

• 根据屏幕大小自动缩放，改变布局。

flex+@media方案

body {
	max-width: 1920px;
	margin: 0;
	padding: 0;
}
.center {
	margin: 0 auto;
	min-width: 1080px;
}
@media screen and (min-width: 1536px) and (max-width: 1920px) {
	.center {
		width: 1440px;
	}
}
@media screen and (min-width: 1440px) and (max-width: 1535px) {
	.center {
		width: 1280px;
	}
}
@media screen and (min-width: 1360px) and (max-width: 1439px) {
	.center {
		width: 1200px;
	}
}
@media screen and (min-width: 1200px) and (max-width: 1359px) {
	.center {
		width: 1080px;
	}
}

注意事项

• body要设置最大宽度max-width。防止某些曲面屏超级长，width:100%样式非常丑。