父元素設置float，來設置水平居中怎么理解
父元素設置float，然后給父元素設置?position:relative?和?left:50%，子元素設置?position:relative?和?left:?-50%?來實現水平居中。來設置水平居中怎么理解
qq_格格_7
2020-01-13
5 回答
舉報
0/150
提交
取消
2020-01-16
我的理解是給父元素設置float:left是先讓這個塊到最左邊，然后設置position:relative 是讓塊可以相對于原位置移動，之后設置left:50%，也就是讓塊離整個頁面的最左邊50%，最后的結果就是塊的左邊貼著整個頁面的中線，之后再設置子元素position:relative，也就是讓子元素相對于現在的位置（即此刻父元素的位置）可以移動，再設置left:?-50% ，相當于子元素相對
于父元素的左邊移動了半個父元素塊的距離，就達到了居中的效果。（理解和表達不對的地方希望指正）
2020-03-20
為什么left:?-50%代表子元素相對于父元素的左邊移動了半個父元素塊的距離，不是相對于父元素來說，子元素在父元素原來的位置上相對想左移動50%？
2020-03-10
并不是。注意看文字解釋。首先是分為三層。第二層ul的最左邊對準第一層父元素div的中間線，第三層li的中間線對準第二層ul的最左邊。
2020-03-04
理解了，因為這個父元素的寬度為0.實際上先向右50%，父元素就在中間這條線上了，然后再向左50%，就是0的50%還是原地沒動，還是蹲在中間線，如果父元素有寬度的話，就會偏移中線
2020-03-03
謝謝圖示? 這下清楚了