jQuery모바일 section, header, footer

jQuery Mobile section, header, footer
jQuery 모바일 section, header, footer
jQuery모바일 섹션구조

1 주요 코드

html

Copy

<section id='page1' data-role='page'>
  <header data-role='header'><h1>제목</h1></header>
  <div class='content'>
    <p>첫번째 페이지</p>
  </div>
  <footer data-role='footer'><h1>jmnote</h1></footer>
</section>

2 예시

html

Copy

<!DOCTYPE html>
<meta charset="utf-8" />
<head>
  <title>섹션 예제</title>
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />
  <script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
  <script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>
</head>
<body>
  <section id='page1' data-role='page'>
    <header data-role='header'><h1>제목</h1></header>
    <div class='content'>
      <p>첫번째 페이지</p>
    </div>
    <footer data-role='footer'><h1>jmnote</h1></footer>
  </section>
</body>

예제: http://zetawiki.com/ex/jquery-mobile/jqm_sectioning.php

3 같이 보기