定位

css 有三种定位机制：

• 普通流 默认
  • 元素框的位置由代码中的位置决定
    • 块级一个接一个垂直排列
    • 行内在一行中水平排列
• 浮动
• 绝对定位

相对定位

• 其位置相对于该元素在普通流中原位置而定
• 原来的位置依然会占据（留空），还是属于普通流
• 移动会导致覆盖其他元素
• 主要用途是为绝对定位设置参考点

绝对定位

• 脱离普通流，移动后不占据原空间，对于其他普通流元素就像不存在
• 位置由相对于距离最近的已定位的祖先元素确定，如果没有已定位的祖先元素，那么位置是相对于初始包含块（最外层html）
• 会覆盖其他元素

固定定位

• 属于绝对定位的一种，差异在于包含块是视口viewport
• 用于固定元素在屏幕中的某一位置

静态定位

• 所有元素的默认值

浮动

• 可以左右浮动
• 不在普通流
• 向一边浮动直到遇到包含框或者另一个浮动元素
• 浮动元素不会影响普通流的位置，但是其中的文本内容会围绕浮动框（可以创建围绕图像），如果想要阻止这个行为可以对这些元素应用 clear