css浮动问题_慕课猿问

css浮动问题

为什么缺一块它不会去自己的位置呢下面是代码<!doctype html><html> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>王者荣耀抽奖小案例</title> <style type="text/css"> .wheel:before, .wheel:after{ content:""; display:table; } .wheel:after{ clear:both; } .wheel{ width:510px;margin:100px auto; } .wheel div{ margin:0 0 -1px -1px; width:100px; height:20px; border:1px solid #262626; float:left; } .wheel .g { width:302px;height:41px; float:left; } </style> </head> <body> <div class="box"> <div class="wheel"> <div class="a">999钻石</div> <div class="b">五级铭文</div> <div class="c">宫本武藏</div> <div class="d">999铭文碎片</div> <div class="e">18888金币</div> <div class="f">凤求凰</div> <div class="g" >天魔乱舞</div> <div class="h">999荣耀水晶</div> <div class="i">武则天</div> <div class="j">海洋之心</div> <div class="k">韩信</div> <div class="l">999英雄碎片</div> <div class="m">999皮肤碎片</div> <div class="n">贵族8</div> <div class="o">九尾妖狐</div> </div> </div> <script type="text/javascript"> </script> </body></html>

查看完整描述

3 回答

已采纳

码农2号

TA贡献151条经验获得超48个赞

<div class="j">海洋之心</div>放在<div class="g" >天魔乱舞</div>前面。
改变布局方法，使用这种新的布局方法，左边是ul>li*4,中间是ul>li*7，右边是ul>li*4；
中间的li全部左浮动，ul要清除浮动影响或者直接给出具体的宽高。
可能后面js会写点击中间的天魔乱舞，四周其他的div会有动画效果。那么找到所有的li，判断是不是天魔乱舞与的宽度，不是都选取，就可以把所有的有动画的例li找到了。然后找出来的li按动画顺序排列，加入动画函数队列。