css定位

普通流的概念

普通流就是 html 文档中的元素如块级元素、行内元素依据他们的显
示属性按照在文档中的先后次序依次显示。是块级元素就占一行或多
行，是行内元素就和其他元素共处一行，没什么好说的，该咋显示咋
显示，一个萝卜一个坑
了解流的概念：
文档流是相对于盒子模型讲的
文本流是相对于文子段落讲的
定位机制
CSS 有三种基本的定位机制：普通流、浮动和绝对定位。 除非专门
指定，否则所有框都在普通流中定位。也就是说，普通流中的元素的
位置由元素在 (X)HTML 中的位置决定。
定位
默认值为 static。可应用于所有元素。 (position:static) static
元素框正常生成：块级元素生成一个矩形框，作为文档流的一部分，
行内元素则会创建一个或多个行框，置于其父元素中。

相对定位

position：relative； 相对定位 没有脱离文档流，也不脱离文本流

1、当没有偏移量，原来位置不变

2、相对定位根据原来自身位置定位

绝对定位

position：absolute；绝对定位，脱离文档流也脱离文本流

1、绝对定位父级没定位根据窗口定位

2、绝对定位父级有定位，根据父级定位

固定定位

position：fixed； 固定定位，脱离文档流，也脱离文本流
1.相对于整个窗口进行定位，不会受滚动条影响
2.使元素脱离文档流和文本流

粘性定位

position：sticky；

当没达到偏移量时 是相对定位。达到偏移量是固定定位