Bootstrap 关于分页的使用

最新推荐文章于 2021-03-16 10:08:08 发布

转载最新推荐文章于 2021-03-16 10:08:08 发布 · 136 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/xxml/p/5623375.html

本文详细解析了一段HTML代码，该代码用于实现网页上的分页导航功能，包括上一页、下一页以及页码链接。通过分析，读者可以了解如何使用HTML和aria属性来创建无障碍的分页组件。

<nav>
  <ul class="pagination">
    <li class="disabled">
      <a href="#" aria-label="Previous">
        <span aria-hidden="true">«</span>
      </a>
    </li>
    <li class="active"><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
    <li>
      <a href="#" aria-label="Next">
        <span aria-hidden="true">»</span>
      </a>
    </li>
  </ul>
</nav>

<nav>
  <ul class="pager">
    <li class="previous"><a href="#"><span aria-hidden="true">←</span> Older</a></li>
    <li class="next"><a href="#">Newer <span aria-hidden="true">→</span></a></li>
  </ul>
</nav>