css之相对定位与绝对定位

绝对定位,position:absolute;会脱离原来的文档流,并让出自己的位置。也就是说:它会浮起来,并且原来占有的位置会被其它的块替代。

相对定位:position:relative;还是会占用原来的位置,不会脱离原来的文档流,也会浮起来。

当一个盒子是用的“绝对定位的时候,它的最外层一定会有个“相对定位的容器”,即这个容器会有一个position:relative;这样这个绝对定位的盒子就会以最近的这个position:relative;作为参考的绝对定位的一个参考物。如果没有一个容器有position属性,则它会把body作为参考物。

另外当一个盒子是用positon:relative;定位,并且,还有margin-top:  和margin-left这样的margin的时候,即使最外层有个postion:relative的盒子,这个margin-top 和margin-left 还是以它前面的一个盒子作为参考对象定位。




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章