.pager { padding-left: 0; margin: 20px 0; text-align: center; list-style: none; } .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: #eee; }
导航默认居中,如果要一个居左一个居右,可以在li分别上追加previous和next类名。实现源码如下:
.pager .next > a, .pager .next > span { float: right; } .pager .previous > a, .pager .previous > span { float: left; }