如果你看到本段文字,说明该页面未正常加载全局JS,部分功能将无法使用,请点击 刷新 重新加载页面。

全站通知:

模板:分页/文档

来自咸鱼之王WIKI_BWIKI_哔哩哔哩
跳到导航 跳到搜索

本零件将生成一对翻页控件。

默认效果

以下为演示效果,链接均无效。

原理

  • 翻页控件会获取当前页的页面名称,使用
    {{#expr}}
    表达式计算出上一页和下一页的链接。
  • 通过
    {{#ifexist}}
    函数判断上一页或下一页是否存在,从而显示或隐藏翻页按钮。

用法

本模板适用于正文较长、需要分段、且页码连续的文章。

使用时应当先准备好页面,如

[[俱乐部]]

的正文较长,分为九页,分别保存在以下九个子页面中:

为以上九个页面的翻页位置(如开头和结束)分别插入本模板{{分页}}即可生效。

使用zp参数设置补零位数。默认情况下不生效。

注意事项

  • 子页面的名称必须是连续的整数,本模板才能正常工作。
  • 中断的页码会导致模板认定错误的首页和末页。
  • 在非主名字空间的页面上尚未验证。
  • 你可能还需要模板:Fa来使箭头符号正常工作。

样式表

  • 本模板默认情况下会使用bootstrap的pager组件样式
  • 以下是本站使用的样式,供自定义样式时参考。

/*paginator*/
.tbui-paginator {
/*最外部容器,上下描边*/
    margin: 24px 0!important;
    padding: 10px 0!important;
    border: 1px solid #56340f;
    border-right: 0;
    border-left: 0;
}
.tbui-paginator li {
/*列表项,单倍行高*/
	line-height:1!important;
}
.tbui-paginator li.paginator-btn a{
/*列表项中的翻页按钮链接*/
    border: 1px solid #e39b00;
    color: #e39b00;
    padding: 0 24px;
    height: 40px;
    line-height: 40px;
    border-radius: 0;
    max-width: none;
    text-align: center;
    background: rgba(0,0,0,0.5);
}
 .tbui-paginator li.paginator-btn a:hover {
/*列表项中的翻页按钮链接,悬停时*/
    background: rgba(227,155,0,0.5)!important;
    color: #FFFFFF!important;
}
.tbui-paginator .tbui-paginator-current{
/*当前页的页码和母页面名称外框*/
	margin:0!important;
	padding:0!important;
	display:inline-block;
	text-align:center;
	color:#FFFFFF;
	
}
.tbui-paginator .tbui-paginator-title,
.tbui-paginator .tbui-paginator-pagenum
{
/*当前页的页码和母页面名称*/
	display:inline-block;
	font-size:16px;
	height:20px;
	line-height:20px;
	text-align:center;
 }