第一种方法
1 <div class="parent"> 2 <div class="child"></div> 3 </div> 4 5 <style> 6 .parent { 7 display: flex; 8 width: 100%; 9 height: 300px; 10 background: #cecece; 11 align-items: center; /* 垂直居中 */ 12 justify-content: center; /* 水平居中 */ 13 } 14 .child { 15 background: #000; 16 width: 200px; 17 height: 100px; 18 } 19 </style>
第二种方法
1 <div class="x1"> 2 <div class="x2"> 3 </div> 4 </div> 5 6 <style> 7 .x1 { 8 width: 1000px; 9 height: 1000px; 10 position: relative; 11 background: #000; 12 } 13 .x2 { 14 width: 20px; 15 height: 20px; 16 margin: auto; 17 top: 0; 18 left: 0; 19 right: 0; 20 bottom: 0; 21 position: absolute; 22 background: #fff; 23 } 24 </style>
原文地址:https://www.cnblogs.com/daidechong/p/11308162.html
时间: 2024-11-05 22:41:36