如何在 yii2 分页中使用引导 glyphicon 图标作为上一个和下一个按钮？答案

【问题标题】：How to use bootstrap glyphicon icons in yii2 pagination for prev and next button?如何在 yii2 分页中使用引导 glyphicon 图标作为上一个和下一个按钮？
【发布时间】：2016-04-07 05:49:54
【问题描述】：

我想在 Yii2 分页中使用引导 glyphicon 图标作为 prev 和 next 按钮。我已经在下面的代码中设置了他们的 css 类，但它没有用。它显示了图标，但不在正确的位置，也没有指向它的链接。

'pager' => [
        'options'          => ['class'=>'pagination'],   // set clas name used in ui list of pagination
        'prevPageLabel'    => '>',   // Set the label for the "previous" page button
        'nextPageLabel'    => '<',   // Set the label for the "next" page button
        'firstPageLabel'   => '>>',   // Set the label for the "first" page button
        'lastPageLabel'    => '<<',    // Set the label for the "last" page button
        'nextPageCssClass' => 'next',    // Set CSS class for the "next" page button
        'prevPageCssClass' => 'perv',    // Set CSS class for the "previous" page button
        'firstPageCssClass'=> 'first',    // Set CSS class for the "first" page button
        'lastPageCssClass' => 'last',    // Set CSS class for the "last" page button
        'maxButtonCount'   => 10,    // Set maximum number of page buttons that can be displayed
    ],

【问题讨论】：

试试'prevPageLabel' => '<span class="glyphicon glyphicon-chevron-left"></span>',
Tanx 人成功了，;)

标签： gridview twitter-bootstrap-3 pagination yii2

【解决方案1】：

您可以使用<span>添加图标：

例如，

'pager' => [
    'options'          => ['class'=>'pagination'],   // set clas name used in ui list of pagination
    'prevPageLabel'    => '<span class="glyphicon glyphicon-chevron-left"></span>',
    'nextPageLabel'    => '<span class="glyphicon glyphicon-chevron-right"></span>',
    'firstPageLabel'   => '<span class="glyphicon glyphicon-fast-backward"></span>',
    'lastPageLabel'    => '<span class="glyphicon glyphicon-fast-forward"></span>',
    'nextPageCssClass' => 'next',    // Set CSS class for the "next" page button
    'prevPageCssClass' => 'prev',    // Set CSS class for the "previous" page button
    'firstPageCssClass'=> 'first',    // Set CSS class for the "first" page button
    'lastPageCssClass' => 'last',    // Set CSS class for the "last" page button
    'maxButtonCount'   => 10,    // Set maximum number of page buttons that can be displayed
],

【讨论】：