浮动元素的排序规则
1.1相同方向上的浮动元素，先浮动的元素会显示在前面，后浮动的元素会显示在后面
1.2浮动元素浮动之后的位置，由浮动元素浮动之前在标准流中的位置来确定

本例中right 右边浮动前的位置就在第二行，所以按照浮动元素排序规则会贴靠右边第二行

如果非得用float,  那就把right和mian两个盒子掉个位置，，保证前两个盒子顺序是right和left就行了

<div class="left">left</div>

<div class="right">right</div>

<div class="main">设计首页的第一步是设计版面布局。就象传统的报刊杂志编辑一样，我们将网页看作一张报纸，一本杂志来进行排版布局。 虽然动态网页技术的发展使得我们开始趋向于学习场景编剧，但是固定的网页版面设计基础依然是必须学习和掌握的。它们的基本原理是共通的，你可以领会要点，举一反三。</div>