定位方案有四种：静态定位、相对定位、绝对定位和固定定位。你可以使用CSS 3中的「position」属性来决定要使用的定位方式。
在这四种方案中，静态和相对定位不会影响整个文档的布局，而绝对和固定定位会与文档分开，因此页面不会为这两种类型的定位元素保留空间。 在默认状态下，所有元素都是静态放置的，即元素从上到下以及从左到右的顺序排列。
只要为元素设置了“ position”属性，就可以使用“ top”，“ right”，“ bottom”和“ left”属性精确定义其位置。
扩展资料：
相对定位中的“top”，“right”，“bottom”和“left”用于设置距元素原始位置的偏移量，但是绝对定位的四个属性不同。
在绝对定位中，“top”是指所定位元素上方的外部边界与容纳块上方的内部边界之间的距离。 换句话说，已定位元素的边距和包含块的边界将影响top的值，进而影响绝对定位元素的位置，但包含块的填充将不起作用。
在相对定位中，“top”是指被定位元素上方的外边界与其原始位置的上边缘之间的距离。“bottom”的含义类似于“top”，是指定位元素下方的外部边界与容纳块下方的内部边界之间的距离，“left”和“right”也是如此。
这两个滚动条不是同一个元素的滚动条，第一个是那个绝对定位的div的滚动条，第二个则是body的滚动条。从它们的黑色框线就能看出来区别啊。所以第二张图的蓝色框当然不会覆盖滚动条啊，因为那是body的滚动条。而第一张图蓝色框覆盖滚动条很容易理解啊，定位元素是脱离文档流的，它们之间的前后关系是由z-index属性来决定的（如果z-index相同则按物理顺序），与它们物理上的包含（或者说父子）关系无关，而滚动条也是元素的组成部分，要覆盖那肯定是连滚动条也一起覆盖的，否则效果就会不伦不类的。
