还是不明白第二章效果图怎么来的？？？输入<span>的作用什么？已经在<div>了啊，当容器动的时候，span内容也会跟着动啊，但为什么文字溢出了边框？？求解！！！！
你把后面的left，top那两行去掉就知道意思了
<div id="div1"></div><span>偏移前的位置还保留不动，覆盖不了前面的div没有偏移前的位置</span>,偏移是产生了一个新的框，原有的框还保留在原位置不显示。所以后面的<span>的位置不会变。
你应该是写错了。<span></span>写在div标签外面：<div id="div1"></div><span>偏移前的位置还保留不动，覆盖不了前面的div没有偏移前的位置</span>，目的是说明span标签相对的是div移动前的位置。再试哈！~
输入<span>，他就是在<div>元素的后面了嘛，但是我们改变了<div>元素的位置，<span>依旧在他原来的位置，这就说明<div>元素原来的位置还保留着的，你看看代码错了没有。
<!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:relative;
left:100px;
top:50px;
}
</style>
</head>
<body>
<div id="div1"></div><span>偏移前的位置还保留不动，覆盖不了前面的div没有偏移前的位置</span>
</body>
</html>