.pager {
display: inline-block;
padding-left: 0;
margin: 20px 0;
list-style: none
}
.pager>li {
display: inline
}
.pager>li>a,.pager>li>span {
position: relative;
float: left;
padding: 5px 12px;
margin-left: -1px;
line-height: 1.53846154;
text-decoration: none;
background-color: #fff;
border: 1px solid #ddd
}
.pager>li:first-child>a,.pager>li:first-child>span {
margin-left: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px
}
.pager>li:last-child>a,.pager>li:last-child>span {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px
}
.pager>li>a:focus,.pager>li>a:hover,.pager>li>span:focus,.pager>li>span:hover {
z-index: 2;
background-color: #e5e5e5
}
.pager>li.active>a,.pager>li.active>a:hover,.pager>li.active>span,.pager>li.active>span:hover {
z-index: 3;
color: #fff;
cursor: default;
background-color: #3280fc;
border-color: #3280fc
}
.pager>li.disabled>a,.pager>li.disabled>a:focus,.pager>li.disabled>a:hover,.pager>li.disabled>span,.pager>li.disabled>span:focus,.pager>li.disabled>span:hover {
color: #ddd;
pointer-events: none;
cursor: not-allowed;
background-color: #fff;
border-color: #ddd
}
.pager-justify {
display: block
}
.pager-justify .next>a,.pager-justify .next>span {
float: right;
border-radius: 4px
}
.pager-justify .previous>a,.pager-justify .previous>span {
float: left;
border-radius: 4px
}
.pager-goto {
width: 100px;
text-align: center
}
.pager>li>div {
float: left
}
.pager>li .pager-goto,.pager>li .pager-size-menu,.pager>li.space {
margin: 0 5px
}
.pager-label {
position: relative;
float: left;
padding: 5px 4px;
margin-left: -1px;
line-height: 1.53846154;
text-decoration: none;
border: 1px solid transparent
}
.pager-item-left>a {
border-top-left-radius: 4px;
border-bottom-left-radius: 4px
}
.pager-item-right>a {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px
}
.pager-lg>li>a,.pager-lg>li>span {
padding: 10px 16px;
font-size: 17px
}
.pager-lg>li:first-child>a,.pager-lg>li:first-child>span {
border-top-left-radius: 6px;
border-bottom-left-radius: 6px
}
.pager-lg>li:last-child>a,.pager-lg>li:last-child>span {
border-top-right-radius: 6px;
border-bottom-right-radius: 6px
}
.pager-sm>li>a,.pager-sm>li>span {
padding: 2px 8px;
font-size: 12px
}
.pager-sm>li:first-child>a,.pager-sm>li:first-child>span {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px
}
.pager-sm>li:last-child>a,.pager-sm>li:last-child>span {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px
}
.pager-pills>li:first-child>a,.pager-pills>li:first-child>span {
border-radius: 16px 0 0 16px
}
.pager-pills>li:last-child>a,.pager-pills>li:last-child>span {
border-radius: 0 16px 16px 0
}
.pager-pills.pager-justify>li>a,.pager-pills.pager-justify>li>span {
border-radius: 16px
}
.pager-loose {
display: block;
margin: 20px 0
}
.pager-loose.pager-pills>li>a,.pager-loose.pager-pills>li>span {
border-radius: 16px
}
.pager-loose>li>a,.pager-loose>li>span {
margin-left: 5px;
border-radius: 4px
}
.pager-loose>li:first-child>a,.pager-loose>li:first-child>span {
margin-left: 0
}.pagination {
display: inline-block;
padding-left: 0;
margin: 20px 0;
border-radius: 4px;
}
.pagination > li {
display: inline;
}
.pagination > li > a,
.pagination > li > span {
position: relative;
float: left;
padding: 6px 12px;
line-height: 1.42857143;
text-decoration: none;
color: #337ab7;
background-color: #fff;
border: 1px solid #ddd;
margin-left: -1px;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
margin-left: 0;
border-bottom-left-radius: 4px;
border-top-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
border-bottom-right-radius: 4px;
border-top-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
z-index: 2;
color: #23527c;
background-color: #eeeeee;
border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
z-index: 3;
color: #fff;
background-color: #337ab7;
border-color: #337ab7;
cursor: default;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
color: #777777;
background-color: #fff;
border-color: #ddd;
cursor: not-allowed;
}
.pagination-lg > li > a,
.pagination-lg > li > span {
padding: 10px 16px;
font-size: 18px;
line-height: 1.3333333;
}
.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
border-bottom-left-radius: 6px;
border-top-left-radius: 6px;
}
.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
border-bottom-right-radius: 6px;
border-top-right-radius: 6px;
}
.pagination-sm > li > a,
.pagination-sm > li > span {
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
}
.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
}
.pager {
padding-left: 0;
margin: 20px 0;
list-style: none;
text-align: center;
}
.pager li {
display: inline;
}
.pager li > a,
.pager li > span {
display: inline-block;
padding: 5px 14px;
background-color: #fff;
border: 1px solid #ddd;
border-radius: 15px;
}
.pager li > a:hover,
.pager li > a:focus {
text-decoration: none;
background-color: #eeeeee;
}
.pager .next > a,
.pager .next > span {
float: right;
}
.pager .previous > a,
.pager .previous > span {
float: left;
}
.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span {
color: #777777;
background-color: #fff;
cursor: not-allowed;
}第三种
/* 分页符 */
.pagination{margin:24px 0}
.pagination .page-link{color:#333;border-radius:0!important;}
.pagination .disabled{display:none}
.pagination .active{display:block;}
.page-item{margin:0 2px;}
.pagination .page-link:focus{box-shadow:none;}
.pagination .active .page-link{background:#ededed;}第四种已经用在项目上的
.page_wp { width: 100%; text-align: center }
.page_wp .fl { float: left; width: 200px; margin: 10px 0; line-height: 30px; }
.page_wp .fl .allRecordset{ margin-right: 20px;}
.pagination { display: inline-block; padding-left: 0; margin: 10px 0; border-radius: 0px; }
.pagination > li { display: inline; }
.pagination > li > a, .pagination > li > span { position: relative; float: left; padding: 6px 12px; margin-left: -1px; line-height: 1.428571429; text-decoration: none; background-color: #ffffff; border: 1px solid #dddddd; }
.pagination > li:first-child > a, .pagination > li:first-child > span { margin-left: 0; border-bottom-left-radius: 0px; border-top-left-radius: 0px; }
.pagination > li:last-child > a, .pagination > li:last-child > span { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { background-color: #eeeeee; }
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { z-index: 2; color: #ffffff; cursor: default; background-color: #cc0000; border-color: #cc0000; }
.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus { color: #999999; cursor: not-allowed; background-color: #ffffff; border-color: #dddddd; }
.pagination-lg > li > a, .pagination-lg > li > span { padding: 10px 16px; font-size: 18px; }
.pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span { border-bottom-left-radius: 0px; border-top-left-radius: 0px; }
.pagination-lg > li:last-child > a, .pagination-lg > li:last-child > span { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }
.pagination-sm > li > a, .pagination-sm > li > span { padding: 5px 10px; font-size: 12px; }
.pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span { border-bottom-left-radius: 0px; border-top-left-radius:0px; }
.pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }