首页  >  文章  >  web前端  >  LI 纵向排列问题_html/css_WEB-ITnose

LI 纵向排列问题_html/css_WEB-ITnose

WBOY
WBOY原创
2016-06-24 12:08:311636浏览


  

        

  •     

  •     

  •     

  •     

  •   





如何让纵向排满一列自动换第二列,大虾们请执教。。。


回复讨论(解决方案)

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



Untitled Document







先横向排然后排满才会下一行吧

建议可以用几个DIV。固定高度,排满后就排到第二个

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


实现了先横向排满后才排下一行。

这样的排法,在FIREFOX中会不兼容


这样就横向了

给li加个浮动对齐,你要算好li的长度跟li之间的间距要小于或等于ul的长度,如果要想排列的整齐,最好在li里面加个溢出隐藏和高度。。。

实现肯定是没问题的,只是有没有必要,而且左边排满再排右边感觉不是很怪吗?左边10个,右边1个的。

如果非按照你想法,供个思路给你,用到jquery,既然你说道右边排满再排右边,也就是整个的高度是固定的,也就可以做到左边最多排列的个数(假设10个),首先这些li统一用position:absolute;定位,然后通过jquery给前面10个导航定位i(i=0;i

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn