本文介绍了网页开发中的文档流概念，涉及元素如何在标准流中自动布局，以及遇到问题时如何通过浮动、绝对定位和固定定位等方法使元素脱离文档流，以实现更灵活的页面设计。
是指页面上的元素在摆放的时候所占用的空间，也泛指页面元素放置的位置。
文档流是文档中可显示对象在排列时所占用的位置/空间例如：块元素自上而下摆放，内联元素，从左到右摆放
标准流里面的限制非常多，导致很多页面效果无法实现
（1）高矮不齐，底边对齐
（2）空白折叠现象
（3）无论多少个空格、换行、tab,都会折叠为一个空格如果我们想让img标签之间没有窄隙 德紧蜜连接蛋
块元素：比如li标签或者h1这种，都是默认自上而下摆放的。内联标签：如果是span标签或者strong标签，它是从左到右进行摆放的。
有些场景并非得从左到右，从上到下进行摆放。
<div>
<span>大家好，我们一起看美女</span>
<img src="1.jpg">
</div>
<span>可以看到有文本的时候，高矮是不一样的，他们是以底边对其的。可能需要居中或者居上对其才好看。高矮不齐的时候是以底边进行对其的。
空格问题，无论在文本位置放置了多少空格，默认出现在页面上面只有一个空格。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>首页</title>
<style>
img{
width: 300px;
height: 300px;
}
</style>
</head>
<body>
<div>
<span>大家好，我们一起看 美女</span>
<img src="1.jpg">
</div>
</body>
</html>
上面都是默认元素会产生的问题。这个时候，就不能使用文档中元素默认的位置去摆放，而是使用脱离文档流的方式去处理。
脱离文档流
使一个元素脱离标准文档流有三种方式
（1）浮动
（2）绝对定位
（3）固定定位
这三种都会脱离文档流，一旦脱离文档流，元素的管理就会变的容易一些。
695
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
