scss 有助于快速添加分页样式并提供“wp_link_pages”标记。
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了scss 有助于快速添加分页样式并提供“wp_link_pages”标记。相关的知识,希望对你有一定的参考价值。
<?php
$defaults = array(
'before' => '<nav class="navigation pagination" role="navigation"><ul class="page-numbers"><li>',
'after' => '</li></ul>',
'separator' => '</li><li>',
'pagelink' => '<span>%</span>',
'echo' => 1
);
wp_link_pages( $defaults );
<?php
$args = array(
'type' => 'list',
'prev_text' => '<span aria-hidden="true"><i class="fa fa-angle-left"></i></span>',
'next_text' => '<span aria-hidden="true"><i class="fa fa-angle-right"></i></span>',
);
the_posts_pagination( $args );
// change variables with your own variables/colors
.navigation {
text-align: center;
margin: 40px 0 0;
.screen-reader-text {
display: none;
}
.page-numbers {
margin: 0;
.fa {
font-size: 18px;
position: relative;
top: 2px;
}
.label{
width: 85px;
span{
display: inline-block;
vertical-align: middle;
}
.fa-angle-left{
margin-right: 5px;
}
.fa-angle-right{
margin-left: 5px;
}
}
> li {
> a,
> span {
padding: $padding-base-vertical 0;
min-width: 43px;
text-align: center;
margin-left: 10px;
margin-top: 10px;
&:hover,
&.current {
background-color: $link-hover-color;
border-color: $link-hover-color;
color: #fff;
}
}
> span {
background-color: $link-hover-color;
border-color: $link-hover-color;
color: #fff;
}
}
}
}
以上是关于scss 有助于快速添加分页样式并提供“wp_link_pages”标记。的主要内容,如果未能解决你的问题,请参考以下文章
scss 通过在项目上添加分配给它的网格顺序和类来调试SCSS网格布局(如Singularity)
在使用 mpdf 库生成的 pdf 中添加分页符
如何添加分页符以增加页面锚定图像?
向我的mysql查询添加分页[重复]
如何在我的搜索结果页上添加分页?
如何在面向协议的网络中添加分页页面