부트스트랩 패널
패널
부트스트랩의 패널은 콘텐츠 주위에 패딩이 있는 테두리가 있는 상자입니다.
기본 패널
패널은 .panel클래스로 생성되고 패널 내부의 콘텐츠에는
.panel-body클래스가 있습니다.
예시
<div class="panel panel-default">
<div class="panel-body">A Basic Panel</div>
</div>
.panel-default클래스는 패널 색상의 스타일을 지정하는 데 사용됩니다 . 더 많은 컨텍스트 클래스는 이 페이지의 마지막 예제를 참조하세요.
패널 제목
패널 제목
패널 내용
.panel-heading클래스는 패널에 제목을 추가합니다 .
예시
<div class="panel panel-default">
<div class="panel-heading">Panel Heading</div>
<div class="panel-body">Panel Content</div>
</div>
패널 바닥글
패널 내용
.panel-footer클래스는 패널에 바닥글을 추가합니다 .
예시
<div class="panel panel-default">
<div class="panel-body">Panel Content</div>
<div class="panel-footer">Panel Footer</div>
</div>
패널 그룹
많은 패널을 그룹화하려면 패널 주위 <div>를 클래스 로 감쌉니다
.panel-group.
클래스 는 .panel-group각 패널의 하단 여백을 지웁니다.
예시
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-body">Panel Content</div>
</div>
<div class="panel panel-default">
<div class="panel-body">Panel Content</div>
</div>
</div>
컨텍스트 클래스가 있는 패널
패널에 색상을 지정하려면 컨텍스트 클래스( .panel-default, .panel-primary, .panel-success, .panel-info, .panel-warning또는 .panel-danger)를 사용하십시오.
예시
Panel with panel-default class
Panel Content
Panel with panel-primary class
Panel Content
Panel with panel-success class
Panel Content
Panel with panel-info class
Panel Content
Panel with panel-warning class
Panel Content
Panel with panel-danger class
Panel Content