![](https://csdnimg.cn/release/download_crawler_static/86295897/bg5.jpg)
效果图如下:
根据之前的说法,top:-35px;值是负数,则直接换成正数,即移动后相对与
移动前向上偏移了35px;我们发现于上,移动后和上⾯的元素发⽣了重叠;
于下,即使相对元素的内容移动了,但是预留空间的元素仍然保存在正常流
动,也就是说相对移动之后,不会对下⾯的其他元素造成影响。
注意:top:20px;是指⼦元素的margin外侧和包
裹元素的border内侧之间的距离是20px。
第四部分:absolute定位
绝对定位的元素相对于最近的已定位⽗元素,如果元素没有已定位的⽗
元素,那么它的位置相对于<html>。
下⾯举⼏个例⼦:
例⼦1:
1
2
3
4
5
6
7
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>绝对定位</title>
<style> body{background:green;}