                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

绝对定位和相对定位

12-7的例子，当我设置成这样时

#div1{

width:200px;

height:200px;

border:2px red solid;

position:absolute;

}

</style>

</head>

<body>

<span>偏移前的位置还保留不动，覆盖不了前面的div没有偏移前的位置</span>

为什么显示的是这个样子？

而设置成相对定位时怎么会变成这个样子

不太理解

Levier007

2017-05-04

源自：初识HTML(5)+CSS(3)-升级版 13-7

关注问题我要回答

1381

操作

收起

6 回答

松强
2017-05-04

小伙子，你还没理解absolute和relative的意思，可以给你看看我的笔记：望采纳

4 回复有任何疑惑可以回复我~

收起回答

Levier007 提问者

嗯嗯问题其实我没描述清楚但现在懂了还是谢谢你的帮助感谢

2017-05-04 回复有任何疑惑可以回复我~

Annari

果然还是要看看大家的评论才懂

2017-10-15 回复有任何疑惑可以回复我~

慕粉2320129565
2017-05-04

亲，你参数没设置。

0 回复有任何疑惑可以回复我~

收起回答

Levier007 提问者

嗯嗯问题其实我没描述清楚但现在懂了还是谢谢你的帮助感谢

2017-05-04 回复有任何疑惑可以回复我~

慕粉2320129565
2017-05-04

你的position设置成了absolute，应该改成relative，并且下面应该设置相对于上面和左边的相对位置参数。

0 回复有任何疑惑可以回复我~

收起回答

qq_唯听是从_0
2017-05-04

你的代码只给了绝对定位，没给偏移多少啊

0 回复有任何疑惑可以回复我~

收起回答

qq_尔瑞海_0
2017-05-04

设置成absolute时，相当于div块是浮于整个页面之上，就象word中的图像浮于文字之上是一样的效果，设置了top、left等值，就浮于设定的位置处，不给top、left值，就相当于浮于原点处，就是你给出的这个样子。

0 回复有任何疑惑可以回复我~

收起回答

Levier007 提问者

问题我还没描述清楚不好意思我设置成相对定位时那一段文字就在红色方框的下边了而绝对定位时文字和方框重合了是这里有点不理解

2017-05-04 回复有任何疑惑可以回复我~

qq_尔瑞海_0 回复 Levier007 提问者

设置成相对位置时，各个元素顺序排列，就相当于word文档中设置图片时是插入文字中，只是设定了偏移值是相对于原来位置来移动，html默认就是相对位置，设置成绝对位置，就将这一个块单拉出来，浮动于整个文档之上，设定的偏移值是相对于浏览器，不给值就是本块相对于浏览器不偏移，这就相当于word文档中设置图片格式是浮于文字上方的效果。这样解释清楚否？你可以设置试试。

2017-05-04 回复有任何疑惑可以回复我~

Levier007 提问者回复 qq_尔瑞海_0

简单来说就是绝对定位方框是浮于文字之上的并不占用文档空间所以文字会直接在第一行显示但当设置成相对定位时方框是占用了空间的此时的文字就只能另起一行这种就显示在方框的下边了对吗这么理解？

2017-05-04 回复有任何疑惑可以回复我~