======Bootstrap Collapsible====== * description : Bootstrap Collapsible * author : 오션 * email : shlim@repia.com * lastupdate : 2021-03-26 \\ =====Basic Collapsible===== Collapsible [컬렙써블]: 접을 수 있는\\ Collapsibles는 많은 양의 콘텐츠를 숨기고 표시하려는 경우에 유용합니다.\\ {{:wiki:bootstrap:bootstrap_note:simple-collapsible.png?600|}}\\ ====에제====

Simple Collapsible

Click on the button to toggle between showing and hiding content.

Lorem, ipsum dolor sit amet consectetur adipisicing elit. Perspiciatis rerum eligendi fuga excepturi nam asperiores eveniet assumenda, quis vitae non, id harum molestias, laboriosam quam magnam doloribus! Nihil, voluptatem incidunt.
\\ ====예제 설명==== ''%%.collapse%%'' 클래스는 접을 수 있는 요소 (이 예에서는
)를 나타냅니다;\\ 이것은 버튼 클릭으로 표시되거나 숨겨 질 콘텐츠입니다.\\ \\ 접을 수 있는 콘텐츠를 제어 (표시 / 숨기기)하려면\\ ''%%data-toggle = "collapse"%%''속성을 ''%%%%''\\ 또는 ''%%
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis voluptatum voluptatibus sed ratione laudantium eius illo autem. Fuga id saepe, numquam similique, possimus blanditiis praesentium ut sunt mollitia minus eius!
\\ =====Collapsible Panel===== ====예제====

Collapsible Panel

Click on the collapsible panel to open and close it.

Collapsible Panel

Panel body
Panel Footer
\\ =====Collapsible List Group===== 다음은 목록 그룹이 내부에 있는 접을 수 있는 패널을 보여줍니다.\\ ====예제====

Collapsible List Group

Click on the collapsible panel to open and close it.

Collapsible list group

  • One
  • Two
  • three
Footer
===Result=== {{:wiki:bootstrap:bootstrap_note:collapsiblelistgroup.png?600|}}\\ \\ =====Accordion===== 다음 예제에서는 패널 구성 요소를 확장하여 간단한 아코디언을 보여줍니다.\\ \\ **Note:** 접힐 수 있는 항목 중 하나가 표시 될 때, 지정된 부모 요소 밑에 있는 모든 접힐 수 있는 요소가 닫히도록 하려면\\ ''%%data-parent%%'' 속성을 사용하십시오.\\ ====예제====

Accordion Example

Note: The data-parent attribute makes sure that
all collapsible elements under the specified parent willl be closed
when one of the collapsible item is shown.

Collapsible Group 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Collapsible Group 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Collapsible Group 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
\\ ===Result=== {{:wiki:bootstrap:bootstrap_note:accordion-example.png?600|}}\\ {{tag>오션 Bootstrap Collapsible}}