关于CS遇到的浮动的问题：注意DIV的顺序和浮动原理！

来源：互联网发布：服务资源智能调度算法编辑：程序博客网时间：2024/05/23 13:59

比对下代码，和效果就找到原因咯：

 问题：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>

代码效果：