首页 | 简单教程,简单编程

代码编辑器：

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/static/lib/bootstrap/4.0.0/css/bootstrap.min.css">
<script src="/static/lib/jquery/3.3.1/jquery.min.js"></script>
<script src="/static/lib/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<div class="container">
    <h2>分页的大小</h2>
    <p>.pagination-lg 类设置大字体的分页条目，.pagination-sm 类设置小字体的分页条目</p>
    <ul class="pagination pagination-lg">
      <li class="page-item"><a class="page-link" href="#">上一页</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"><a class="page-link" href="#">3</a></li>
      <li class="page-item"><a class="page-link" href="#">下一页</a></li>
    </ul>

<ul class="pagination pagination-sm">
      <li class="page-item"><a class="page-link" href="#">上一页</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"><a class="page-link" href="#">3</a></li>
      <li class="page-item"><a class="page-link" href="#">下一页</a></li>
    </ul> 
</div>

运行结果：