티스토리 뷰

WEB/css

페이징 css

silverline79 silverline79 2021. 6. 29. 14:19

<!-- 페이징 -->
<div class="pagination"><span class="firstPage">첫페이지</span> <span class="preBlock">이전</span> <a href="#" title="1페이지 이동">1</a> <a href="#" title="2페이지 이동">2</a> <a href="#" title="3페이지 이동">3</a> <a href="#" title="4페이지 이동">4</a> <strong>5</strong> <span class="nextBlock">다음</span> <span class="lastPage">마지막페이지</span> </div>
<!-- //페이징 -->

 

 

/* **************************************** *
 * pagination
 * **************************************** */
.pagination { padding: 15px 0; text-align: center; font-size: 0; }
.pagination span, .pagination a, .pagination strong { display: inline-block; margin: 0 10px 0 0; position: relative; line-height: 30px; border-radius: 10px; font-size: 16px; }
.pagination strong { width: 30px; height: 30px; color: #ffffff; border: 1px solid #222222; background-color: #222222; }
.pagination a { width: 30px; height: 30px; border: 1px solid #e4e4e4; background-color: #ffffff; border-radius: 10px; }
.pagination a:hover { color: inherit; }
.pagination .firstPage, .pagination .preBlock, .pagination .nextBlock, .pagination .lastPage { display: inline-block; width: 30px; height: 30px; border: 1px solid #e4e4e4; text-indent: -9999px; }
.pagination .firstPage { background: #fff url(../images/style/page_first.png) no-repeat 50% 50%; }
.pagination .preBlock { background: #fff url(../images/style/page_prev.png) no-repeat 50% 50%; }
.pagination .nextBlock { background: #fff url(../images/style/page_next.png) no-repeat 50% 50%; }
.pagination .lastPage { background: #fff url(../images/style/page_last.png) no-repeat 50% 50%; }

 

 

 

page_first.png
0.00MB
page_last.png
0.00MB
page_next.png
0.00MB
page_prev.png
0.00MB

'WEB > css' 카테고리의 다른 글

버튼 투명처리 후 배경  (0) 2021.06.29
닫기버튼 회전 애니메이션  (0) 2021.06.29
box-shadow 투명적용  (0) 2021.06.29
페이징 css  (0) 2021.06.29
말줄임  (0) 2021.06.29
체크 박스  (0) 2021.06.29
댓글
댓글쓰기 폼
공지사항
최근에 달린 댓글
Total
3,551
Today
1
Yesterday
1
링크
TAG more
«   2021/11   »
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30        
글 보관함