Pagination

리스트 및 테이블 형태에 사용되는 Pagination 템플릿 입니다.
용도에 맞게 스타일을 정의하시면 됩니다.

Simple 타입 (class="pagination simple")


box 타입 (class="pagination")
HTML
CSS
	 /* box type */
    .pagination {
      float: left; margin: 0; border: 1px solid #666; *display: inline; *zoom: 1;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); border-radius: 3px 3px 3px 3px;
    }
    .pagination li { display: inline; }
    .pagination a {
      float: left; border-right: 1px solid #666;
      line-height: 34px; padding: 0 14px; text-decoration: none;
    }
    .pagination a:hover, .pagination .active a { background: #C7EEFE; }
    .pagination .disabled a, .pagination .disabled a:hover {
      background: transparent; color: #BFBFBF;
    }
    .pagination .next a { border: 0 none; }
    
    /* simple type */
    .pagination.simple { border: 0; box-shadow: none; }
    .pagination.simple a { line-height: 20px; padding: 0 8px; border-color: #ccc; color: #000; }
    .pagination.simple a:hover { background: #EBEBEB; }
    .pagination.simple .active a { font-weight: bold; background: none; color: #F89406; }
    .pagination.simple .prev a:hover,
    .pagination.simple .next a:hover { background: none; }
History