图形的相对定位---绝对定位 ------ 固定定位
相对定位：占位置 <! DOCTYPE html > < html lang ="en" > < head > < meta charset ="UTF-8" > < title > Title </ title > < style > .box { width : 200px ; height : 200px ; background-color : red ; position : relative ; /* 相对定位占位置，后面的元素接着排列 */ top : 30px ; /* 在margin-top的位置基础上移动，这样就压盖了下面的图形 */ left : 40px ; /* 在margin-top的位置基础上移动，这样就压盖了下面的图形 */ margin-top : 30px ; /* 两个div一起向下移动30px */ } .box2 { width : 200px ; height : 200px ; background-color : green ; } </ style > </ head > < body style ="height: 2000px;" > < div class ="box" ></ div > < div class ="box2" ></ div > </ body > </ html > 绝对定位：不占位置，脱标了 <!