定位的方法有很多种,它们分别是静态(static),绝对定位(absolute),固定(fixed),相对定位(relative)。针对你的问题,这里重点介绍相对定位:
1、相对定位(relative):对象不可层叠,依据left,right,top,bottom等属性在正常文档流中偏移自身位置。同样可以用z-index分层设计。
2、相对定位需要达成几个条件:
1)参照物:相对谁来进行定位,如何确定参照物;
2)相对的方式是什么:左右偏移、上下偏移等;
3)偏移的量是多少;
看一下下面的例子:
demo:
ceshi
demo效果图:
参照物:d1,属性:position: relative,决定他为父级,如果去掉该属性,d2的参照物就变成body如图:
;
偏移方式:左右偏移,left: 50px,相对于参照物向左偏移50px,也就是d2左边距离d1左边50px;
给用作参照的层添加position:relative;,同时给要找参照的层添加position:absolute;即可。
table{position:absolute}div{position:releative} 原理就是这样