列表显示数据时，分页显示是必不可少的功能，活不多说，直接干货拿走，django提供了一个分页器Paginator，下面的例子说明如何使用它。

1，写一个带分页功能的查询方法

编辑 myweb\web\views.py文件，加入如下代码

from models import Tasks

from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger

from django.views.decorators import csrf

#任务列表

def task_list(request):

contact_list=Tasks.objects.all().order_by('-task_start_date')

#每页显示25条

paginator=Paginator(contact_list, 25)

page=request.GET.get('page')

try:

contacts=paginator.page(page)

except PageNotAnInteger:

contacts=paginator.page(1)

except EmptyPage:

contacts=paginator.page(paginator.num_pages)

return render(request, 'taskList.html', {'contacts': contacts})

这里是将数据返回到前端页面 taskList.html页面。

2，前端页面获取并显示数据

在myweb\web\templates目录新建一个taskList.html文件,内容如下：

{% extends 'base.html' %}

{% block content %}

<table class="tableList">

<thead>

<tr>

<th>任务名称</th>

<th>操作者</th>

<th>任务描述</th>

<th>开始日期</th>

<th>结束日期</th>

<th>任务评价</th>

</tr>

</thead>

<tbody>

{% if contacts.paginator.count > 0 %}

{% for contact in contacts %}

<tr>

<td> {{ contact.task_name }} </td>

<td> {{ contact.task_user }} </td>

<td> {{ contact.task_describe }}</td>

<td> {{ contact.task_start_date }} </td>

<td> {{ contact.task_end_date }} </td>

<td> {{ contact.task_result }}</td>

</tr>

{% endfor %}

{% else %}

<tr>

<td colspan="10" align="center">没有任务数据</td>

</tr>

{% endif %}

</tbody>

</table>

{# 分页HTML代码 #}

<div class="pagination">

<span class="step-links">

{% if contacts.has_previous %}

<a href="?page={{ contacts.previous_page_number }}">上一页</a>

{% endif %}

<span class="current">

Page {{ contacts.number }} of {{ contacts.paginator.num_pages }}.

</span>

{% if contacts.has_next %}

<a href="?page={{ contacts.next_page_number }}">下一页</a>

{% endif %}

</span>

</div>

{% endblock %}

3，URL映射

编辑urls.py文件，加入：

url(r'^tasklist/', views.task_list),

JS代码：
/*
* 分页方法
* author:Mr.X
* time:2017/12/27
*/

Request=GetRequest();
var searchType=$("#search_type").val();
var key=Request[searchType];
var keyIndex=key.lastIndexOf('.');
if(keyIndex !=-1){
key=key.substring(0, keyIndex)
}
var IFRAME_SRC="http://"+window.location.host+"/search/"+searchType+"/"+key;//初始url
var page=Request['p'];//获取url中的地址参数
if(page==null||page==""){
page=1;
}
var limit=12;//每页限制条数
var page_all="";//总页数
$(document).ready(function (){
page_list();
});
function page_list(){
var count=$("#page_count").html();//新闻总数
var remainder=count%limit;//判断是否有余数，有余数的话，整除后，余数+1，就是总页数；如果余数为0，即为整除，则整除后的的数即为总页数
if(count<=limit){
//总数达不到每页显示的条数，则不显示页码
}else{
//总数超过一页，即总数超过limit规定的条数，显示分页
//先判断余数为0的情况：如果余数为0，即为整除，则整除后的的数即为总页数
if(remainder==0){
var page_number=count/limit;//总页码数
page_number=parseInt(page_number);//将页码数由字符串类型转换为整形
page_all=page_number;
//如果页码数不超过5，则显示全部分页总数
if(page_number<6){
page=parseInt(page);//将获取到的页码数转换成整数
var page_pre=page-1;
var url_pre=IFRAME_SRC+'/p/'+page_pre;//上一页
var url_index=IFRAME_SRC+'/p/'+1;//首页
var url_last=IFRAME_SRC+'/p/'+page_number;//尾页
if(page==1){
//如果页码page=1，则隐藏上一页
//$("#page_list").append("<li class='paginate_button previous disabled' aria-controls='example' tabindex='0' id='example_previous'><a>上一页</a></li>");
}else{
//如果页码page不是1，则显示首页和上一页
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_index+"'>首页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_pre+"'>上一页</a></li>");
}
//对页码进行赋值
for(var i=0; i<page_number; i++){
var j=i+1;
var url=IFRAME_SRC+'/p/'+j;
if(page==j){
//如果是当前页，则给当前页加上active
$("#page_list").append("<li class='paginate_button active' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}else{
//如果不是当前页，则去掉active
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}
}
//page=parseInt(page);
var page_next=page+1;
var url_next=IFRAME_SRC+'/p/'+page_next;//下一页
if(page==page_number){
//如果是最后一页，则隐藏下一页功能
//$("#page_list").append("<li class='paginate_button next disabled' aria-controls='example' tabindex='0' id='example_next'><a>下一页</a></li>");
}else{
//如果不是最后一页，则显示最后一页和尾页
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_next+"'>下一页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>尾页</a></li>");
}
}
//如果页码超过5，则分块显示:点击第一页，显示：1/2/3/4/5/..page_number,点击第二页，显示：1/2/3/4/5/..page_number,点击第三页，显示：1/2/3/4/5/..page_number,点击第四页：显示：1/2/3/4/5/..page_number,点击第五页，显示：1...3/4/5/6/7/..page_number;点击page_number,显示:1../page_number-4/page_number-3/page_number-2/page_number-1/page_number
else{
if(page==1||page==2||page==3||page==4){
page=parseInt(page);//将字符串转换为整形
var page_pre=page-1;
var url_pre=IFRAME_SRC+'/p/'+page_pre;//上一页
var url_index=IFRAME_SRC+'/p/'+1;//首页
var url_last=IFRAME_SRC+'/p/'+page_number;//最后一页
if(page==1){
//$("#page_list").append("<li class='paginate_button previous disabled' aria-controls='example' tabindex='0' id='example_previous'><a>上一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_index+"'>首页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_pre+"'>上一页</a></li>");
}
for(var i=0; i<page_number; i++){
if(i>4){
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>..."+page_number+"</a></li>");
break;
}
var j=i+1;
var url=IFRAME_SRC+'/p/'+j;
//$(window.parent.document).find("#tab_13 iframe").attr("src",url);
 //url=$(window.parent.document).find("#tab_13 iframe").attr("src");
if(page==j){
$("#page_list").append("<li class='paginate_button active' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}
}
page=parseInt(page);
var page_next=page+1;
var url_next=IFRAME_SRC+'/p/'+page_next;
if(page==page_number){
//$("#page_list").append("<li class='paginate_button next disabled' aria-controls='example' tabindex='0' id='example_next'><a>下一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_next+"'>下一页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>尾页</a></li>");
}
}else if(page==page_number-3||page==page_number-2||page==page_number-1||page==page_number){
page=parseInt(page);//将字符串转换为整形
var page_pre=page-1;
var url_pre=IFRAME_SRC+'/p/'+page_pre;//上一页
var url_index=IFRAME_SRC+'/p/'+1;//首页
var url_last=IFRAME_SRC+'/p/'+page_number;//最后一页
if(page==1){
//$("#page_list").append("<li class='paginate_button previous disabled' aria-controls='example' tabindex='0' id='example_previous'><a>上一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_index+"'>首页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_pre+"'>上一页</a></li>");
}
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_index+"'>"+1+"...</a></li>");
for(var i=page_number-4; i<page_number+1; i++){
var j=i;
var url=IFRAME_SRC+'/p/'+j;
if(page==j){
$("#page_list").append("<li class='paginate_button active' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}
}
page=parseInt(page);
var page_next=page+1;
var url_next=IFRAME_SRC+'/p/'+page_next;
if(page==page_number){
//$("#page_list").append("<li class='paginate_button next disabled' aria-controls='example' tabindex='0' id='example_next'><a>下一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_next+"'>下一页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>尾页</a></li>");
}
}else{
page=parseInt(page);//将字符串转换为整形
var page_pre=page-1;
var url_pre=IFRAME_SRC+'/p/'+page_pre;//上一页
var url_index=IFRAME_SRC+'/p/'+1;//首页
var url_last=IFRAME_SRC+'/p/'+page_number;//最后一页
if(page==1){
//$("#page_list").append("<li class='paginate_button previous disabled' aria-controls='example' tabindex='0' id='example_previous'><a>上一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_index+"'>首页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_pre+"'>上一页</a></li>");
}
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_index+"'>"+1+"...</a></li>");
for(var i=page-3; i<page+2; i++){
var j=i+1;
var url=IFRAME_SRC+'/p/'+j;
if(page==j){
$("#page_list").append("<li class='paginate_button active' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}
}
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>..."+page_number+"</a></li>");
page=parseInt(page);
var page_next=page+1;
var url_next=IFRAME_SRC+'/p/'+page_next;
if(page==page_number){
//$("#page_list").append("<li class='paginate_button next disabled' aria-controls='example' tabindex='0' id='example_next'><a>下一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_next+"'>下一页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>尾页</a></li>");
}
}
}
$("#page_list").append("<span id='goto-page'>到第</span><input id='selcet_page' value='"+page+"'/><span id='go-page'>页</span>");
$("#page_list").append("<button type='button' id='change_page'>确定</button>");
}
//如果余数不为0，则将整除后的整数+1，即为总页码
else{
var page_number=count/limit;
page_number=parseInt(page_number);
page_number=page_number+1;
page_all=page_number;
//如果页码数不超过5，则显示全部分页总数
if(page_number<6){
page=parseInt(page);//将获取到的页码数转换成整数
var page_pre=page-1;
var url_pre=IFRAME_SRC+'/p/'+page_pre;//上一页
var url_index=IFRAME_SRC+'/p/'+1;//首页
var url_last=IFRAME_SRC+'/p/'+page_number;//尾页
if(page==1){
//如果页码page=1，则隐藏上一页
 //$("#page_list").append("<li class='paginate_button previous disabled' aria-controls='example' tabindex='0' id='example_previous'><a>上一页</a></li>");
}else{
//如果页码page不是1，则显示首页和上一页
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_index+"'>首页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_pre+"'>上一页</a></li>");
}
//对页码进行赋值
for(var i=0; i<page_number; i++){
var j=i+1;
var url=IFRAME_SRC+'/p/'+j;
if(page==j){
//如果是当前页，则给当前页加上active
$("#page_list").append("<li class='paginate_button active' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}else{
//如果不是当前页，则去掉active
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}
}
//page=parseInt(page);
var page_next=page+1;
var url_next=IFRAME_SRC+'/p/'+page_next;//下一页
if(page==page_number){
//如果是最后一页，则隐藏下一页功能
 //$("#page_list").append("<li class='paginate_button next disabled' aria-controls='example' tabindex='0' id='example_next'><a>下一页</a></li>");
}else{
//如果不是最后一页，则显示最后一页和尾页
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_next+"'>下一页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>尾页</a></li>");
}
}
//如果页码超过5，则分块显示:点击第一页，显示：1/2/3/4/5/..page_number,点击第二页，显示：1/2/3/4/5/..page_number,点击第三页，显示：1/2/3/4/5/..page_number,点击第四页：显示：1/2/3/4/5/..page_number,点击第五页，显示：1...3/4/5/6/7/..page_number;点击page_number,显示:1../page_number-4/page_number-3/page_number-2/page_number-1/page_number
else{
if(page==1||page==2||page==3||page==4){
page=parseInt(page);//将字符串转换为整形
var page_pre=page-1;
var url_pre=IFRAME_SRC+'/p/'+page_pre;//上一页
var url_index=IFRAME_SRC+'/p/'+1;//首页
var url_last=IFRAME_SRC+'/p/'+page_number;//最后一页
if(page==1){
//$("#page_list").append("<li class='paginate_button previous disabled' aria-controls='example' tabindex='0' id='example_previous'><a>上一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_index+"'>首页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_pre+"'>上一页</a></li>");
}
for(var i=0; i<page_number; i++){
if(i>4){
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>..."+page_number+"</a></li>");
break;
}
var j=i+1;
var url=IFRAME_SRC+'/p/'+j;
if(page==j){
$("#page_list").append("<li class='paginate_button active' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}
}
page=parseInt(page);
var page_next=page+1;
var url_next=IFRAME_SRC+'/p/'+page_next;
if(page==page_number){
//$("#page_list").append("<li class='paginate_button next disabled' aria-controls='example' tabindex='0' id='example_next'><a>下一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_next+"'>下一页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>尾页</a></li>");
}
}else if(page==page_number-3||page==page_number-2||page==page_number-1||page==page_number){
page=parseInt(page);//将字符串转换为整形
var page_pre=page-1;
var url_pre=IFRAME_SRC+'/p/'+page_pre;//上一页
var url_index=IFRAME_SRC+'/p/'+1;//首页
var url_last=IFRAME_SRC+'/p/'+page_number;//最后一页
if(page==1){
//$("#page_list").append("<li class='paginate_button previous disabled' aria-controls='example' tabindex='0' id='example_previous'><a>上一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_index+"'>首页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_pre+"'>上一页</a></li>");
}
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_index+"'>"+1+"...</a></li>");
for(var i=page_number-4; i<page_number+1; i++){
var j=i;
var url=IFRAME_SRC+'/p/'+j;
if(page==j){
$("#page_list").append("<li class='paginate_button active' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}
}
page=parseInt(page);
var page_next=page+1;
var url_next=IFRAME_SRC+'/p/'+page_next;
if(page==page_number){
//$("#page_list").append("<li class='paginate_button next disabled' aria-controls='example' tabindex='0' id='example_next'><a>下一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_next+"'>下一页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>尾页</a></li>");
}
}else{
page=parseInt(page);//将字符串转换为整形
var page_pre=page-1;
var url_pre=IFRAME_SRC+'/p/'+page_pre;//上一页
var url_index=IFRAME_SRC+'/p/'+1;//首页
var url_last=IFRAME_SRC+'/p/'+page_number;//最后一页
if(page==1){
//$("#page_list").append("<li class='paginate_button previous disabled' aria-controls='example' tabindex='0' id='example_previous'><a>上一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_index+"'>首页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_previous'><a href='"+url_pre+"'>上一页</a></li>");
}
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_index+"'>"+1+"...</a></li>");
for(var i=page-3; i<page+2; i++){
var j=i+1;
var url=IFRAME_SRC+'/p/'+j;
if(page==j){
$("#page_list").append("<li class='paginate_button active' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0'><a href='"+url+"'>"+j+"</a></li>");
}
}
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>..."+page_number+"</a></li>");
page=parseInt(page);
var page_next=page+1;
var url_next=IFRAME_SRC+'/p/'+page_next;
if(page==page_number){
//$("#page_list").append("<li class='paginate_button next disabled' aria-controls='example' tabindex='0' id='example_next'><a>下一页</a></li>");
}else{
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_next+"'>下一页</a></li>");
$("#page_list").append("<li class='paginate_button' aria-controls='example' tabindex='0' id='example_next'><a href='"+url_last+"'>尾页</a></li>");
}
}
}
$("#page_list").append("<span id='goto-page'>到第</span><input id='selcet_page' value='"+page+"'/><span id='go-page'>页</span>");
$("#page_list").append("<button type='button' id='change_page'>确定</button>");
}
}
}
//跳转的到某一页
$(document).on("click","#change_page",function(){
var page_num=$("#selcet_page").val();
page_num=parseInt(page_num);//将字符串转换为整形
 //go_text=page_num;
 //alert(page_num);
if(page_num>page_all){
/*$('.success_message').show();
 $("#message_info").html('页码超出范围，请输入正确页码'); */
alert('页码超出范围，请输入正确页码');
return false;
}
if((/^(\+|-)?\d+$/.test( page_num ))&&page_num>0){ 
location.href=IFRAME_SRC+"/p/"+page_num;
}else{ 
/* $('.success_message').show();
 $("#message_info").html('非法页码，请输入正确页码');*/
 /*alert('非法页码，请输入正确页码');*/
layer.msg("非法页码，请重新输入",{time: 2000});
return false;
}
//$("#selcet_page").html(go_text);
});
//获取url参数
function GetRequest() {
var url=location.href; //获取整个url
var theRequest=new Object();
if (url.indexOf("/") !=-1) {
var str=url.substr(7);
strs=str.split("/");
for(var i=0; i < strs.length; i ++) {
if(i==0){
}else{
theRequest[strs[i]]=decodeURIComponent(strs[i+1]);
i=i+1;
}
}
}
return theRequest;
}
//输入框只能输入数字
$(function(){
var bind_name='input';
if (navigator.userAgent.indexOf("MSIE") !=-1) {
//ie情况下特殊处理
bind_name='propertychange';
}
$('#selcet_page').bind(bind_name,function(){
var value=$("#selcet_page").val();
if((/^(\+|-)?\d+$/.test( value ))&&value>0&&value<(page_all+1))
{
}
else{
$("#selcet_page").val("");
return false;
}
});
})HTML代码：<section class="page mt30 mb30">{php}if(isset($count)){{/php}<div id="page_count" style="display:none;">{$count}</div> <div class="dataTables_paginate paging_simple_numbers col-xs-12 marbtm10" id="example_paginate"> <ul class="pagination" id="page_list"> </ul> </div>{php}}{/php}</section>CSS代码：#example_paginate{display: inline-block}.pagination>li{ display: inline-block;margin-right: 10px;padding: 5px 10px;cursor: pointer}.pagination>li>a{color: #fff}.pagination>li.active,.pagination>li:hover,#example_next:hover,#example_previous:hover{ background: #fdc74a;}#change_page:hover{background-color:#f26c1d;cursor: pointer}#selcet_page{ background: #fff;padding: 4px 10px;width: 4em;text-align: center;}#example_next,#example_previous{background: #fff}#example_next>a,#example_previous>a{color: #ff9530}#example_next:hover>a,#change_page:hover>a{color: #fff}#change_page{ background-color: #fdc74a;padding: 4px 10px;color: #fff;height: 29px;display: inline-block;margin-left: 10px;}#goto-page{padding-right: 5px;color: #fff;}#go-page{padding-left: 5px;color: #fff;}.shownum{color: #fff;margin-right: 20px;}.shownum>a{padding: 4px 10px;margin-right: 5px}