CSS中實現子div水平居中有多種方式,以下介紹兩種常用方法。
方法一:使用text-align
將父div的text-align屬性設置為center,將子div的display屬性設置為inline-block即可實現水平居中。
父div{ text-align: center; } 子div{ display: inline-block; }
方法二:使用margin
利用子div的margin屬性,將左右margin設置為auto,實現居中。
父div{ position: relative; } 子div{ position: absolute; left: 50%; margin-left: -子div寬度的一半; }
其中,方法二需要將父div的position屬性設置為relative,子div的position屬性設置為absolute,left設為50%。由于left的值為相對于父div左邊的距離,因此還需將子div的margin-left設為負的寬度的一半。
以上兩種方法都能實現子div的水平居中,具體使用哪種取決于具體需求。