정보실

웹학교

정보실

jquerymobile 버튼에 그리드 아이콘 추가하기

본문

<!DOCTYPE html>

<html>

<head>

<style type='text/css'>

.ui-page .ui-footer .ui-btn-text {

  font-size: 20px;

}

</style>

</head>

<body>

  <link rel="stylesheet"

    href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />

  <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>

  <script

    src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>

  <div data-role="page">

    <div data-role="content">

      <p>Test Page</p>

    </div>

    <div data-role="footer" data-position="fixed">

      <div data-role="navbar">

        <ul>

          <li><a href="" data-role="tab" data-icon="grid"

            class="ui-btn-active">Page 1</a></li>

          <li><a href="" data-role="tab" data-icon="grid">Page

              2</a></li>

          <li><a href="" data-role="tab" data-icon="grid">Page

              3</a></li>

        </ul>

      </div>

    </div>

  </div>

</body>

</html> 

  • 트위터로 보내기
  • 페이스북으로 보내기
  • 구글플러스로 보내기
  • 카카오톡으로 보내기

페이지 정보

조회 195회 ]  작성일15-05-25 15:29

웹학교