Html
    Css
    Js

    
                        
 body {
	overflow-x:hidden;
	margin:0 auto;
}
.main {
	width:800px;
	zoom:1;
	margin:0 auto;
}
.item {
	width:800px;
	overflow:hidden;
}
ul {
	padding:0;
	width:40%;
	zoom:1;
	margin:0 10px;
}
.clear {
	zoom:1;
}
.clear:after {
	content:"";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
ul li {
	list-style-type:none;
	float:left;
	background:#F69;
	font-size:60px;
	text-shadow:1px 1px 3px #555;
	width:37%;
	height:30%;
	margin:10px 10px 10px 30px;
	text-align:center;
	color:#fff;
}
.page_btn {
	padding-top:20px;
	margin:0 5.8rem;
}
.page_btn a {
	cursor:pointer;
	padding:5px;
	border:solid 1px #ccc;
	font-size:16px;
}
.page_box {
	float:left;
	margin-right:15px;
}
.num {
	padding:0 10px;
	font-size:16px;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

jquery伪分页效果静态页面实现分页(原创)

0