两款bootstrap分页样式美化特效

两款bootstrap分页样式美化特效

这是两款bootstrap分页样式美化特效。该bootstrap分页样式美化特效在元素bootstrap分页样式的基础上,通过简单的CSS代码,将对它们进行效果美化。

使用方法
在页面中引入bootstrap.min.css文件。

<link rel="stylesheet" href="css/bootstrap.min.css">

HTML结构
第一款bootstrap分页样式的HTML代码如下:

<div class="container">
    <div class="row pad-15">
        <div class="col-md-12">
            <nav class="pagination-outer" aria-label="Page navigation">
                <ul class="pagination">
                    <li class="page-item">
                        <a href="#" class="page-link" aria-label="Previous">
                            <span aria-hidden="true">«</span>
                        </a>
                    </li>
                    <li class="page-item"><a class="page-link" href="#">1</a></li>
                    <li class="page-item"><a class="page-link" href="#">2</a></li>
                    <li class="page-item active"><a class="page-link" href="#">3</a></li>
                    <li class="page-item"><a class="page-link" href="#">4</a></li>
                    <li class="page-item"><a class="page-link" href="#">5</a></li>
                    <li class="page-item">
                        <a href="#" class="page-link" aria-label="Next">
                            <span aria-hidden="true">»</span>
                        </a>
                    </li>
                </ul>
            </nav>
        </div>
    </div>
</div>


无法在这个位置找到: AD-M-710-200.htm
相关插件
无法在这个位置找到: AD-M-ar-1.htm