margin為啥可以取負(fù)數(shù)？
為了實現(xiàn)一些特別的布局效果。
margin為負(fù)值如何理解？
margin本意是兩個盒子之間的間距，那么margin為負(fù)值就是說兩個盒子重疊了？那只有一個盒子怎么辦？
假設(shè)A-B橫排放置，然后B是我們的研究對象，B的margin-left為-10.瀏覽器會怎么處理？瀏覽器會把B向左移動10px，如果設(shè)置B的margin-right為-10.這時就不是動B了，而是把C左移動10px。就這么個邏輯。
image.png
margin為負(fù)對float的影響
A元素不浮動時。
margin-right就沒啥影響了，因為就不在同一行。
<style>
#mydiv1 { margin-right:-100px;}
</style>
<div id="mydiv1">First</div>
<div id="mydiv2">Second</div>
結(jié)果如圖
image.png
A元素浮動時
兩個div并排排列，margin發(fā)揮作用。
<style>
/* A negative margin is applied opposite the float */
#mydiv1 {float:left; margin-right:-100px;}
</style>
<div id="mydiv1">First</div>
<div id="mydiv2">Second</div>
結(jié)果
image.png
符合上面說的。給A設(shè)置的右邊-100的屬性，表現(xiàn)是B左移100px。
再看
<style>
#mydiv1 {float:left; margin-left:-100px;}
</style>
<div id="mydiv1">First</div>
<div id="mydiv2">Second</div>
左邊是負(fù)自己移動，右邊是負(fù)鄰居移動。
因此結(jié)果
image.png
![Uploading image_542898.png . . .]
