content
    
    
     
left
    
    
     
right
    
html>

HTML文档流必须从Main开始然后才是两侧

文档流：文档流是文档中可显示对象在排列时所占用的位置。将窗体自上而下分成一行行，并在每行中按从左至右的挨次排放元素。

网页中大部分对象默认是占用文档流，也有一些对象是不占文档流的，比如表单中隐藏域。

当然我们也可以让占用文档流的元素转换成不占文档流，这就要用到CSS中属性position来控制。

有三种状况将使得元素离开文档流而存在，分别是浮动、绝对定位、固定定位。然则在IE中浮动元素也存在于文档流中。

浮动元素不占任何正常文档流空间，而浮动元素的定位照样基于正常的文档流，然后从文档流中抽出并且能够尽量远的挪动至左侧或者右侧。

文字内容会环绕在浮动元素四周。当一个元素从正常文档流中抽出后，依然在文档流中的其他元素将疏忽该元素并填补他原先的空间。

——————

核心问题是Html文档流必须从Main开始然后才是两侧，下面就是这个要求的Html结构

1 
     
       2 
     
 3 
     
       4 
     
 5 
     
       6 
     

常规做法把两侧放在主要内容的前面进行左右浮动，然后中间使用边距，这样有个缺点就是网速慢的时候主要内容却在最后显示。

按照上面的Html布局，如果按常规把left和right各自左右浮动，中间main使用边距的话就会出现下面这种情况：

一、使用绝对定位。

不占用文档流的先读

绝对定位需要设置左右边距（实际应用中往往需要在外面套一个相对定位的盒子）。