Latest web development tutorials

이온 머리와 바닥

헤더 (헤더)

헤더 조립체가 화면 상단에 고정되는 경우에는 주변의 제목 및 기능 버튼으로 포장 할 수있다.

이온 기본 색상 스타일의 많은 종류를 제공, 다른 스타일의 이름을 호출 할 수 있습니다, 물론, 당신은 사용자 정의 할 수 있습니다.

바 빛

<div class="bar bar-header bar-light">
  <h1 class="title">bar-light</h1>
</div>

»시도

바 안정

<div class="bar bar-header bar-stable">
  <h1 class="title">bar-stable</h1>
</div>

»시도

바 양성

<div class="bar bar-header bar-positive">
  <h1 class="title">bar-positive</h1>
</div>

»시도

바 - 진정

<div class="bar bar-header bar-calm">
  <h1 class="title">bar-calm</h1>
</div>

»시도

바 균형

<div class="bar bar-header bar-balanced">
  <h1 class="title">bar-balanced</h1>
</div>

»시도

바 통전

<div class="bar bar-header bar-energized">
  <h1 class="title">bar-energized</h1>
</div>

»시도

바 독단적

<div class="bar bar-header bar-assertive">
  <h1 class="title">bar-assertive</h1>
</div>

»시도

바 - 왕

<div class="bar bar-header bar-royal">
  <h1 class="title">bar-royal</h1>
</div>

»시도

바 어두운

<div class="bar bar-header bar-dark">
  <h1 class="title">bar-dark</h1>
</div>

»시도


서브 헤더 (자막)

서브 헤더도이 헤더를 작성하지 않은 경우에도, 그냥이 머리글 아래 상단에 고정되어, 서브 헤더이 스타일은 거리의 상단에서 헤더가 있습니다. 헤더와 컬러 스타일.

<div class="bar bar-header">
  <h1 class="title">Header</h1>
</div>
<div class="bar bar-subheader">
  <h2 class="title">Sub Header</h2>
</div>

»시도


바닥 글 (아래)

글 여러 컨텐트 유형을 포함 할 수있는 화면의 아래쪽에있다.

<div class="bar bar-footer bar-balanced">
  <div class="title">Footer</div>
</div>

»시도

위의 헤더, 바 - 바닥 글을 수행하기위한 유일한 스타일 이름 바 헤더와 바닥 글.

<div class="bar bar-footer">
  <button class="button button-clear">Left</button>
  <div class="title">Title</div>
  <button class="button button-clear">Right</button>
</div>

»시도

바닥에는 제목이 없다,하지만 그들은 오른쪽 버튼을 필요로하는 경우 또한, 당신은 같은 풀 권리를 추가하려면 오른쪽 버튼이 필요합니다

<div class="bar bar-footer">
  <button class="button button-clear pull-right">Right</button>
</div>

»시도