入門菜鳥,希望能給和菜鳥相互取暖
最近在改造wordpress,自己寫代碼做了個分頁
1,在自己主題下的style.css中增加如下css
Js代碼
將以下程式碼copy到自己theme的functions.php中,.pagination { width: auto; display: block; text-align: center; margin: 30px; } .pagination a { background-color: #eee; text-decoration: none; color: #999; font-size: 18px; padding: 0px 10px; line-height: 32px; height: 32px; margin: 0px 0.5px; } .pagination a.page-btn { width: 40px; } .pagination a.page-btn .icon-prev { position: absolute; width: 0px; height: 0px; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid transparent; border-right: 6px solid transparent; border-left: none; border-right: 6px solid #999; left: 50%; margin-left: -3px; top: 50%; margin-top: -6px; -webkit-transition: all 0.1s ease; transition: all 0.1s ease; } .pagination a.page-btn .icon-next { position: absolute; width: 0px; height: 0px; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid transparent; border-right: 6px solid transparent; border-right: none; border-left: 6px solid #999; left: 50%; margin-left: -3px; top: 50%; margin-top: -6px; -webkit-transition: all 0.1s ease; transition: all 0.1s ease; } .pagination a:hover { color: #fff; } .pagination a:hover .icon-prev { width: 0px; height: 0px; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid transparent; border-right: 6px solid transparent; border-left: none; border-right: 6px solid #fff; } .pagination a:hover .icon-next { width: 0px; height: 0px; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid transparent; border-right: 6px solid transparent; border-right: none; border-left: 6px solid #fff; } .pagination span { display: inline-block; margin: 0px 1px; color: #adadad; font-size: 18px; }
, 我使用的WP query,形如