jquery masonry 瀑布流怎么居中
<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery.masonry.min.js"></script>
<script type="text/javascript">
$(function(){
$('#container').masonry({
// options
itemSelector : '.item',
columnWidth : 20,
gutterWidth :10,
});
});
var $container = $('#container');
$container.imagesLoaded(function(){
$container.masonry({
itemSelector : '.item',
columnWidth :2
});
});
</script>
<style type="text/css">
.item {
width: 220;
margin: 5;
float: left;
}
img{
width:220px;
}
</style>
</head>
<body>
<center>
<div id="container">
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/299.jpg"/></div>
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/296.jpg"/></div>
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/301.jpg"/></div>
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/288.jpg"/></div>
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/289.jpg"/></div>
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/299.jpg"/></div>
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/258.jpg"/></div>
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/244.jpg"/></div>
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/266.jpg"/></div>
<div class="item"><img src="http://192.168.1.67:80/zsyl04/image/4545/262.jpg"/></div>
</div>
</center>
</body>
</html>怎么才能让他居中显示，每列显示4列呢
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
你好,看到你这个插件了,例子很强大,大概浏览一下文档,好像没发现动态加载的例子,能解释一下么!
http://xudafeng.github.io/autoResponsive/demo/loader/