صفحه بندی

سبک 1

قبلی
1
2
3
بعد


<div class="pagination radius-5 d-block">
    <ul>
        <li><a href="#!"><i class="fas fa-long-arrow-alt-left me-2"></i> Prev</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="#!">Next<i class="fas fa-long-arrow-alt-right ms-2"></i></a></li>
    </ul>
</div>

سبک 2


<nav aria-label="Page navigation example">
    <ul class="pagination">
        <li class="page-item">
            <a class="me-0 border-end-0" href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a>
        </li>
        <li class="page-item"><a class="me-0 border-end-0" href="#">1</a></li>
        <li class="page-item"><a class="me-0 border-end-0" href="#">2</a></li>
        <li class="page-item"><a class="me-0 border-end-0" href="#">3</a></li>
        <li class="page-item">
            <a class="page-link" href="#" aria-label="Next"><span aria-hidden="true">&raquo;</span></a>
        </li>
    </ul>
</nav>

سبک 3


<nav>
    <ul class="pagination">
        <li class="page-item disabled">
            <a class="me-0 border-end-0" href="#" tabindex="-1">Previous</a>
        </li>
        <li class="page-item active" aria-current="page"><a class="me-0 border-end-0" href="#">1</a></li>
        <li class="page-item"><a class="me-0 border-end-0" href="#">2</a></li>
        <li class="page-item"><a class="me-0 border-end-0" href="#">3</a></li>
        <li class="page-item"><a href="#">Next</a>
        </li>
    </ul>
</nav>

خرید قالب

سوال سریع؟