前面那位慕粉XXXXX說(shuō)的很正確，我也要補(bǔ)充一下細(xì)節(jié)。外層的

元素通過(guò)position:relative;left:50%;的樣式轉(zhuǎn)到了頁(yè)面中線右側(cè)，這種方法是前面課程說(shuō)到的"層模型中的相對(duì)定位"，left:50%的意思就是把元素依照原位置從左向右移動(dòng)其原有寬度的50%的距離，記得嗎，塊級(jí)元素都是獨(dú)占一行，寬度占滿。元素內(nèi)部的子元素要相對(duì)于元素進(jìn)行定位，同樣的，通過(guò)position:relative;left:-50%;的樣式，子元素把自己的一半從右向左移到了中線的左側(cè)。這也是前面說(shuō)的到"層模型中的相對(duì)定位"。大家可以通過(guò)設(shè)置background或者border來(lái)幫助理解呀。

看到了嗎？紅底藍(lán)邊的就是父div，黃底綠邊的就是子div，父div左邊border就是中線。

.wrap{

float:left;

background:?red;

border:2px?solid?blue;

position:relative;

left:50%;

}

.wrap-center{

background:yellow;

border:2px?solid?green;

position:relative;

left:-50%;

}

通過(guò)修改left的值，很容易就能理解的

總結(jié)

以上是生活随笔為你收集整理的手机html left 50%,left-​50%是什么意思的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。