JQuery Mobile 学习笔记

 

 

主题

修改主题 data-theme

image

源代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <meta name="viewport" content="width=device-width,initial-scale=1" /> 
    <title></title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
</head>
<body>
    <div data-role="page">
        <div data-role="header" data-theme="b">
            <h1>page header</h1>
        </div>
        
        <div data-role="content">
            <p>hello jquery mobile</p>
        </div>
        
        <div data-role="footer">
            <h4>page footer</h4>
        </div>
    </div>
</body>
</html>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <meta name="viewport" content="width=device-width,initial-scale=1" /> 
    <title></title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
</head>
<body>
    <div data-role="page">
        <div data-role="header" data-theme="b">
            <h1>page header</h1>
        </div>
        
        <div data-role="content">
            <p>hello jquery mobile</p>
        </div>
        
        <div data-role="footer">
            <h4>page footer</h4>
        </div>
    </div>
</body>
</html>

 

工

posted @ 2013-08-08 15:32  吉桂昕  阅读(719)  评论(0)    收藏  举报