Pagination
페이지 간 이동을 위한 네비게이션 컴포넌트입니다.
Pagination
페이지 간 이동을 위한 네비게이션 컴포넌트입니다.
Pagination
페이지 간 이동을 위한 네비게이션 컴포넌트입니다.
Anatomy
ESSENTIAL
1. 첫 페이지 버튼
첫 페이지로 이동하는 버튼입니다. 첫 페이지에서는 비활성(disabled)됩니다.
2. 페이지 버튼
각 페이지 번호를 나타내는 버튼입니다. 숫자는 연속적으로 표시되며, 현재 위치를 시각적으로 구분합니다.
3. 마지막 페이지 버튼
마지막 페이지로 이동하는 버튼입니다. 마지막 페이지에서는 비활성(disabled)됩니다.
Anatomy
ESSENTIAL
1. 첫 페이지 버튼
첫 페이지로 이동하는 버튼입니다. 첫 페이지에서는 비활성(disabled)됩니다.
2. 페이지 버튼
각 페이지 번호를 나타내는 버튼입니다. 숫자는 연속적으로 표시되며, 현재 위치를 시각적으로 구분합니다.
3. 마지막 페이지 버튼
마지막 페이지로 이동하는 버튼입니다. 마지막 페이지에서는 비활성(disabled)됩니다.
Anatomy
ESSENTIAL
1. 첫 페이지 버튼
첫 페이지로 이동하는 버튼입니다. 첫 페이지에서는 비활성(disabled)됩니다.
2. 페이지 버튼
각 페이지 번호를 나타내는 버튼입니다. 숫자는 연속적으로 표시되며, 현재 위치를 시각적으로 구분합니다.
3. 마지막 페이지 버튼
마지막 페이지로 이동하는 버튼입니다. 마지막 페이지에서는 비활성(disabled)됩니다.
State
Control
position
start
middle
end
Control
position
start
middle
end
Control
position
start
middle
end
Properties
size | L, S |
Properties
size | L, S |
Properties
size | L, S |
Spec
 | Width1~2자리 숫자는 동일한 너비를 유지하고, |
 | Alignment4 페이지 이상부터 선택된 페이지가 |
Spec
Width
1~2자리 숫자는 동일한 너비를 유지하고, 3자리 이상 숫자부터 버튼 너비가 유동적으로 늘어납니다.
Alignment
4 페이지 이상부터 선택된 페이지가 항상 가운데 위치하게 됩니다. 클릭 횟수를 줄여 사용성을 높입니다.
Spec
| Width1~2자리 숫자는 동일한 너비를 유지하고, |
| Alignment4 페이지 이상부터 선택된 페이지가 |
Usage
Do
모든 콘텐츠 아래 중앙 정렬하여 사용합니다.
Don't
첫 페이지에 First 버튼을 사용할 수 없습니다.
Usage
Do
모든 콘텐츠 아래 중앙 정렬하여 사용합니다.
Don't
첫 페이지에 First 버튼을 사용할 수 없습니다.
Usage
Do
모든 콘텐츠 아래 중앙 정렬하여 사용합니다.
Don't
첫 페이지에 First 버튼을 사용할 수 없습니다.
©Codeit
Contact Us
©Codeit
Contact Us
©Codeit
Contact Us