任务48:自定义分页样式
1,直接复制CSS文件 到 \public\static\index\css\pagination.css

#pull_right{ text-align:center; } .pull-right { /*float: left!important;*/ } .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; margin:0 4px; line-height: 37px; height:37px; color: #555; text-decoration: none; background-color: #fff; cursor: pointer; /*border: 1px solid #ddd;*/ } .pagination > li:first-child > a, .pagination > li:first-child > span { margin-left: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .pagination > li:last-child > a, .pagination > li:last-child > span { border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { color: #ff4c4c; cursor: default; background-color: #fafafa; border-bottom: 2px solid #ff4c4c; } .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: #ff4c4c; cursor: default; background-color: #fafafa; border-bottom: 2px solid #ff4c4c; } .pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus { color: #777; cursor: not-allowed; background-color: #fff; border-color: #ddd; } .clear{ clear: both; }
2,\resources\views\Index\Index\index.blad.php 模板上引用该CSS
<link rel="stylesheet" id="genericons-style-css" href="{{asset('static')}}/index/css/pagination.css" type="text/css" media="all"> </head>
3,首页上显示 page 分页 效果如下
END