响应式居中-在整个屏幕最中间的位置

方法一：具有固定定位的屏幕居中

.XulgrCenter{
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

注意：此方法是悬浮固定的，比较鸡肋，仅适合做弹出层或loading的样式使用。

 

方法二：具有正常占位的非固定定位

.XulgrCenter{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100vh;
	width: 100vw;
}

注意：此方法需要规定屏幕宽高为100%或100vw和100vh，可能会超出边界，可用

/*隐藏超出部分*/
overflow: hidden;

/*隐藏滚动条*/
body::-webkit-scrollbar {
    width: 0 !important;
}

但同时会导致无法滑动。