1 div { 2 position: relative / fixed; /* 相对定位或绝对定位均可 */ 3 width:500px; 4 height:300px; 5 top: 50%; 6 left: 50%; 7 margin-top:-150px; 8 margin-left:-250px; 9 外边距为自身宽高的一半 */ 10 background-color: pink; /* 方便看效果 */ 11 } 12 13 .container { 14 display: flex; 15 align-items: center; /* 垂直居中 */ 16 justify-content: center; /* 水平居中 */ 17 18 } 19 .container div { 20 width: 100px; /* 可省 */ 21 height: 100px; /* 可省 */ 22 background-color: pink; /* 方便看效果 */ 23 }