페이지로 나누기 위젯은 <devsite-pagination> 맞춤 요소를 사용하여 페이지로 나눈 콘텐츠를 표시하거나 표시되는 콘텐츠의 양을 전환합니다.
일반 사용법
다음 예에서는 <devsite-pagination> 맞춤 요소를 사용하여 페이지당 4개의 <div> 요소를 페이지로 나누는 container 요소를 지정합니다.
디비전 1
디비전 2
디비전 3
디비전 4
디비전 5
디비전 6
디비전 7
div 8
디비전 9
10구
11구
12구
12구
14구
15구
여러 HTML 요소
다음 예시에서는 <devsite-pagination> 맞춤 요소를 사용하여 동일한 컨테이너에서 <p> 및 <div> 요소를 페이지로 나누는 container 요소를 지정합니다.
첫 번째 단락입니다.
단락 2입니다.
단락 3입니다.
단락 4입니다.
단락 5입니다.
단락 6.
div 1입니다.
div 2입니다.
div 3입니다.
이는 div 4입니다.
이는 div 5입니다.
div 6입니다.
버튼 UI
다음 예에서는 <devsite-pagination> 맞춤 요소를 사용하여 8개의 초기 <div> 요소를 로드하고 전환해 More를 표시하는 container 요소를 지정합니다.
디비전 1
디비전 2
디비전 3
디비전 4
디비전 5
디비전 6
디비전 7
div 8
디비전 9
10구
11구
12구
12구
14구
15구
시작 확장
다음 예시에서는<devsite-pagination> 맞춤 요소를 지정하여container 요소가start-expanded 모두 로드하는 속성<div>
전환할 수 있습니다.간략히 보기 에서 확인할 수 있습니다.
디비전 1
디비전 2
디비전 3
디비전 4
디비전 5
디비전 6
디비전 7
div 8
디비전 9
10구
11구
12구
12구
14구
15구