<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,
maximum-scale=1.0,minimum-scale=1.0,
user-scalable=no">
<!--
width:넓이(픽셀),height:높이(픽셀)
device-width->pc,tablet,cellphone의 넓이에 맞게 화면설정하라
initial-scale=1.0,(초기배율(기본 꽉찬화면))
maximum-scale=1.0,(최대배율(범위 0~10.0)
minimum-scale=1.0,(최소비율(기본값 0.25 범위 0~10.0)
user-scalable=no(사용자가 확대/축소할 수 있는지 여부결정(yes/no))
-->
<title>jQuery Mobile예제</title>
<!-- mobile css->jQuery(1.8~1.11)->mobile jquery(1.4.5) -->
<link href="../mobile/jquery.mobile-1.4.5.min.css" rel="stylesheet">
<script type="text/javascript" src="../mobile/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="../mobile/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<!-- data-role(page)(기능을 부여할때 사용하는 속성) -->
<div data-role="page">
<!-- 1.header지정(문서의 제목,상단메뉴),툴바 -->
<div data-role="header">
<h1>My Title</h1>
</div>
<!-- 2.본문내용 -->
<div data-role="content">
<p>jQuery Mobile page 구성</p>
</div>
<!-- 3.footer(꼬리말) -->
<div data-role="footer">
<h1>화면 하단</h1>
</div>
</div>
</body>
</html>
2022-08-11