Panel
Panel은 Header/Footer bar와 함께 페이지를 구성하는 요소이다. Panel은 여러 색상을 지원하며 겹쳐서 사용도 가능하다.
기본코드
Panel의 기본코드는 <div class="ui-body-[a~g]">를 사용하며 a~g는 Panel 의 색상 변경을 지원한다.
Panel
- <div class="ui-body-c center"><h4>Panel</h4></div>
색상변경
색상 변경시에는 <div class="ui-body-[a~g]">를 변경한다.
Content A
Content B
Content C
Content D
Content E
Content F
Content G
- <div class="ui-body-a">
- <h4>Content A</h4>
- </div>
- <div class="ui-body-b">
- <h4>Content B</h4>
- </div>
- <div class="ui-body-c">
- <h4>Content C</h4>
- </div>
- <div class="ui-body-d">
- <h4>Content D</h4>
- </div>
- <div class="ui-body-e">
- <h4>Content E</h4>
- </div>
- <div class="ui-body-f">
- <h4>Content F</h4>
- </div>
- <div class="ui-body-g">
- <h4>Content G</h4>
- </div>
무늬 변경
Panel 의 무늬 변경은 기본코드에 class="egov-panel-pattern-a~g" 을 추가한다.
무늬 변경
- <div class="ui-body-f egov-panel-pattern-f"><h4>무늬 변경</h4</div>