文档流／脱离文档流
文档流，指的是元素在排版布局过程中，元素会从自上到下，从左到右的顺序依次排列；
脱离文档流，指的是元素不再按照这个自然顺序排列；别的元素在文档流中排列时就当没有这个脱硫文档流的元素一样；
脱离文档流的方法
定位 ／ 浮动
1、定位的几种方式：
（1）、static： 默认值，按照文档流的顺序进行排列；-- 未脱离文档流，占据文档流；
（2）、relative：他将出现在它所在的位置之上，相对自己本身进行定位；移动将会覆盖文档流中的元素；（它所占的空间将依然会被保留）； -- 未脱离文档流，占据文档流；
（3）、absolute：相对于第一个relative定位的父元素进行定位；（他所占的空间将会从文档流中移除）
（4）、fixed：相对于浏览器窗口进行定位；（他所占的空间将会从文档流中移除）
定位通过z-index进行层级显示；
2、浮动：
（1）、浮动的框可以向左或向右移动，直到碰到包含他的框或者另一个浮动元素的边框位置。
（2）、对其他浮动元素的影响：后浮动的元素永不会超过先浮动元素的顶端。
（3）、对普通元素的影响：浮动元素会从文档正常流中删除，使得紧挨它的元素位置发生偏移，影响布局。
（4）、对文字的影响：浮动元素向下延伸时，不会影响正常文本的显示，文本会相对于浮动元素进行偏移。
网友评论