对比一下不设置position，和relative，absolute的图。

可以看出不设置和设置relative两张图文字位置没有任何变化。因为position：relative不会脱离文档流。虽然通过设置left和top移动了div，但是文档流中依然占据最开始的位置，不会影响其他元素。假设你不设置left和top值，那么两张图是完全一样的。

而第三张图中，可以看出文字跑到最上面了。因为position：absolute会脱离文档流。只是你移动了div，看起来不在一起。如果不设置top和left的话，就会发现div没动，但是文字跑上来重叠在一起了。

你把top和left都去掉，再在浏览器中查看就会明白了。

顺便说一下，css里的注释不能用//，你看你图片里的注释都没有变灰。只是刚好因为加了//浏览器不认识所以没有执行。