什么是文本流和文档流？为什么文本会超出盒子宽度？为什么会超出高度？

文档流：是相对于盒子模型讲的

文本流：是相对于元素中的文本讲的

        元素浮动之后（float布局）元素盒子则会脱离文档流，也就是说当他后面还有元素盒子时，其他元素盒子会无视他所占据了的区域，直接在它身下布局。但是文字、图片、表单等文本元素依然会为这个脱离了文档流的元素盒子让出位置，围绕着它布局，也就是说浮动元素没有脱离文本流。

        绝对定位后，不仅元素盒子会脱离文档流，同时也会脱离文本流，那么后面的文本和其他元素盒子就会视该元素盒子的位置而不见，直接出现在它下面。

示例一：蓝色区域为左浮动，因此其脱离了文档流，故红色区域会直接无视他，但是因为其未脱离文本流，故文本不会占用其位置。 如图所示

示例2：蓝色区域设置为绝对定位，那么他就会同时脱离文本流和文档流，如图2所示

tips：这里有个大坑，我想了半天，为啥aaaaa超出盒子的宽度呢？？？？最后经过百度发现原来如果全是 aaaaaaaaaaaaaaaaaa这样的纯英文，那么你测试的时候是不会换行的，浏览器认为这是一个单词。换成汉字就会发现他会换行了

        文本会溢出主要还是因为我们把盒子的宽高给定死了，如果们不写宽高那么盒子的大小完全就由内容决定，也就是内容撑开了整个盒子。