728x90
bootstrap 페이지네이션(Pagination)이란?
아래와 같은 기능이다
양쪽 영어보다 화살표로 심플하게 하고 싶다면
Previous와 Next가 있는 라인을 a태그로 시작하는 아래의 코드로 바꿔주면 된다
<a class="page-link" href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
크기조절은
class="pagination pagination 뒤에 -sm(스몰)이나 -lg(라지) 씩으로 붙여주면 된다
<ul class="pagination pagination-lg">
<nav aria-label="Page navigation example">
<ul class="pagination justify-content-center">
<li class="page-item">
<a class="page-link" href="#" 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"><a class="page-link" href="#">3</a></li>
<li class="page-item">
<a class="page-link" href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
공홈 페이지네이션 링크
https://getbootstrap.kr/docs/5.0/components/pagination/
728x90
반응형
'웹 관련 > Bootstrap' 카테고리의 다른 글
[Bootstrap] 부트스트랩 코드에 CSS 적용시키기 (0) | 2022.05.02 |
---|