假如有
<ol>
<li>.....</li><li>.....</li><li>.....</li><li>.....</li><li>.....</li>
<li>.....</li><li>.....</li><li>.....</li>..........
</ol>
我想实现固定高度，第一列是前面五个序号是1,2,3,4，5。然后超过高度后到第二列排序第二列的序号是6,7,8,9,10以此类推。用ul li： float left实现的是横向排序，明白我的意思吗？
数据分析师2017-10-01 01:18:00
javascript - css或者jQuery实现 ol li中竖向排序，横向滚动-PHP中文网问答-javascript - css或者jQuery实现 ol li中竖向排序，横向滚动-PHP中文网问答
围观一下哦，学习一下。
迷茫2017-04-10 12:49:00
<html>
<head>
<title>Bootstrap</title>
<meta charset="utf-8"/>
<style type="text/css">
body,p{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;}
</style>
</head>
<body>
<p id="list_item">
<p class="list_inner">
<ol class="list">
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
<li>周末再看吧</li>
</ol>
</p>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript">
$(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<len/br;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'});
});
}
})
</script>
</p>
</body>
就这样吧 虽然觉得不太简洁