html让竖着得li变成横着得,css或者jQuery实现 ol li中竖向排序，横向滚动

Bootstrap

body,div{margin: 0;padding: 0;}

#list_item{overflow-x: scroll;overflow-y: hidden;width: 500px;}

.list_inner{height: 170px;}

.list{height: 150px;float: left;position: relative;}

1. 周末再看吧
2. 周末再看吧
3. 周末再看吧
4. 周末再看吧
5. 周末再看吧
6. 周末再看吧
7. 周末再看吧
8. 周末再看吧
9. 周末再看吧
10. 周末再看吧
11. 周末再看吧
12. 周末再看吧
13. 周末再看吧
14. 周末再看吧
15. 周末再看吧
16. 周末再看吧
17. 周末再看吧
18. 周末再看吧
19. 周末再看吧
20. 周末再看吧
21. 周末再看吧
22. 周末再看吧
23. 周末再看吧
24. 周末再看吧
25. 周末再看吧
26. 周末再看吧
27. 周末再看吧
28. 周末再看吧
29. 周末再看吧
30. 周末再看吧

$(function(){

var i_height = $('.list li:first').height();

var i_width = $('.list li:first').width()+60;

var o_height = $('.list').height();

var len = $('.list li').length;

var br = parseInt(o_height/i_height);

$('.list_inner,.list').css('width',(parseInt(len/br)+1)*i_width+'px');

for(var i = 0; i

var dom = (i!=parseInt(len/br)?$('.list li').slice((i+1)*br,(i+2)*br+1):$('.list li:gt('+(i+1)*br+')'));

$.each(dom,function(j,item){

$(item).css({'position':'absolute','left':(i+1)*i_width+40+'px','top':j*i_height+'px'});

});

}

})

就这样吧 虽然觉得不太简洁