Static：静态定位
Relative：相对定位，相对自己原来的位置偏移，原来位置还是会保留在自然流/常规流中，心系家乡。（老家有套房子，想回来的时候随时可以回来）
Absolute: 绝对定位, 脱离文档流定位，如果没有父容器，会认body为父元素，同样利用lrtb属性来控制偏移，原来位置不会保留在自然流中。（把老家房子卖了...）
变异特性：父容器设置relative（相对定位），子元素设置absolute（绝对定位）
fixed：固定定位，不会随着视口的滚动而滚动，和absolute的性质是一样的，在没有relative的情况下，都是脱离常规流，相对于body定位。
sticky：磁铁定位/粘性定位/吸附定位，是relavtive和fixed的完美结合，制造出吸附效果。
注意：因为没有考虑自身的长度和高度，所以效果并不是垂直水平居中，我们只需要设置一下外边距，上外边距为高的一半，左外边距宽的一半即可。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> body{ margin:0; padding:0; color:#fff; text-align:center; } .container{ width:90%; max-width:1000px; height:1000px; background:#4c77f2; margin:0 auto; } </style> </head> <body> <div class="container"> 页面布局-----行布局 </div> </body> </html>
原文：https://www.cnblogs.com/jack-zhou21235/p/11906789.html