偏移前的位置保留不动-慕课网

偏移前的位置保留不动

来源：13-7 相对于自己的位置-层模型之相对定位

VOTS

2015-04-06 11:57

先理解绝对定位

把代码改成：

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>relative样式</title> <style type="text/css">
#div1{ width:200px; height:200px; border:2px red solid;position:absolut;left:200px;top:100px;} </style> </head> <body>

<SPAN>偏移前的位置保留不动偏移前的位置保留不动偏移前的位置保留不动</SPAN></body> </html>

显示效果是

div的原有位置改动了，left:200px;top:100px,而span中的内容则显示到div之上了(有点像给div加了个浮动效果)，也就是说div的原来位置是改变了，

再看相对定位中，偏移前的位置保留不动　先确定了div的原有位置和span原有的位置没有变,当div原有的位置发生相对定位改变时,span还是在原来的位置,否则 span中的内容位置也会发生改变,可是没有改变,相对定位则有点像是copy了一份粘贴到了其他位置,绝对定位则是相当于直接剪切掉了粘贴到其他的新位置.

不知道我的理解正确不.有不正确的说下..

写回答关注