<div class="box" id="one">One</div>
<div class="box" id="two">Two</div>
<div class="box" id="three">Three</div>
<div class="box" id="four">Four</div>
.box {
display: inline-block;
100px;
height: 100px;
background: red;
color: white;
}
#two {
position: relative;
top: 20px;
left: 20px;
background: blue;
}
static
按照正常的排版来排列网页元素：
网页根据先后顺序自动排版。
relativ
按照正常的排版来排列网页元素，但是可以相对他的基础值发生偏移：
实现控制页面显示位置，根据你来美化你的网页显示。
absolute
会删除他该有的位置，他根据祖先来偏移定位置：
当网页中有需要置顶的声明等。
fixed
固定在视口来偏移 ：
主要运用广告
sticky
偏移相对于它的最近的祖先可以重叠：
可以实现粘性布局将放不下的元素组合放在一起
如图片，文档等。