본문 바로가기

Python_WEB/JavaScript

[Ch16]모바일 웹 페이지 연습문제 3

반응형

Q>

jQuery Mobile의 리스트뷰 기능을 이용해서 다음과 같은 웹 페이지를 작성해 본다.

 

A>

<!DOCTYPE html>
<html lang="ko">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jQuery Mobile Quiz 3</title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>

<body>
    <div>
        <div data-role="page">
            <div data-role="header">
                <h1>리스트뷰 예제</h1>
            </div>
            <div data-role="content">
                <h2>스마트폰 업체 리스트</h2>
                <ul data-role="listview">
                    <li><a href="#">삼승전자</a></li>
                    <li><a href="#">애플</a></li>
                    <li><a href="#">MG전자</a></li>
                </ul>
            </div>
            <div data-role="footer">
                <h4>(c)홍길동</h4>
            </div>
        </div>
    </div>
</body>

</html>

 

R>

 

HTML5 + CSS3 + JavaScript로 배우는 웹프로그래밍 기초
국내도서
저자 : 천인국
출판 : 인피니티북스 2013.12.19
상세보기
반응형