比对下代码,和效果就找到原因咯:
问题:more为什么不上去?
<div style="width:400px;background-color:yellow;">
<div style="width:100px">新闻中心</div>
<div style="float:right;">more</div>
</div>
<hr />
左浮动举例:
<div style="width:400px;background-color:yellow;">
<div style="float:left;">5</div>
<div style="float:left;">4</div>
<div style="float:left;">3</div>
<div style="float:left;">2</div>
<div style="float:left;">1</div>
</div>
<hr />
右浮动举例:
<div style="width:400px;background-color:yellow;">
<div style="float:right;">5</div>
<div style="float:right;">4</div>
<div style="float:right;">3</div>
<div style="float:right;">2</div>
<div style="float:right;">1</div>
</div>
<hr />
混合举例一:
<div style="width:400px;background-color:yellow;">
<div style="float:right;">5</div>
<div style="float:left;">4</div>
<div style="float:right;">3</div>
<div style="float:left;">2</div>
<div style="float:right;">1</div>
</div>
<hr />
混合举例二:
<div style="width:400px;background-color:yellow;">
<div style="float:right;">5</div>
<div style="float:left;">4</div>
<div >NO1</div>
<div style="float:right;">3</div>
<div >NO2</div>
<div style="float:left;">2</div>
<div style="float:right;">1</div>
</div>
<hr />
混合举例三:
<div style="width:400px;background-color:yellow;">
<div style="float:left;width:100px;">4</div>
<div style="width:100px;">我不浮动</div>
<div style="float:right;width:100px;">5</div>
</div>
<hr />
混合举例四:
<div style="width:400px;background-color:yellow;">
<div style="float:right;width:100px;">5</div>
<div style="float:left;width:100px;">4</div>
<div style="width:100px;">我不浮动</div>
</div>
混合举例五:
<div style="width:400px;background-color:yellow;">
<div style="float:left;width:100px;">4</div>
<div style="width:100px;">我不浮动</div>
<div style="float:right;width:100px;">5</div>
</div>
代码效果: