在CSS中,让盒子居中一直是一个普遍的问题。以下是一些方法。/* 1.使用margin属性 */ .box { width: 100px; height: 100px; background-colo
在CSS中,让盒子居中一直是一个普遍的问题。以下是一些方法。
/* 1.使用margin属性 */ .box { width: 100px; height: 100px; background-color: gray; margin: 0 auto; } /* 2.使用display属性 */ .parent { display: flex; justify-content: center; align-items: center; } .parent .box { width: 100px; height: 100px; background-color: gray; } /* 3.使用position属性 */ .parent { position: relative; } .parent .box { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
以上是几种让盒子居中的方法。使用margin、display和position属性都可以实现这个目标。
粉丝
0
关注
0
收藏
0