jQuery Mobile是一款非常流行的移動端Web開發框架,它基于jQuery和CSS3構建,在網頁中實現類似原生應用的體驗。下面是一個簡單的使用jQuery Mobile創建一個頁面的示例:
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>jQuery Mobile示例頁面</title> <link rel="stylesheet" > <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script> <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> </head> <body> <div data-role="page"> <div data-role="header"> <h1>這是頭部</h1> </div> <div data-role="content"> <p>這是內容</p> </div> <div data-role="footer"> <h4>這是底部</h4> </div> </div> </body> </html>
在上面的代碼中,我們引入了jQuery Mobile的CSS和JS文件,并在body標簽內創建一個data-role為page的div,它是整個頁面的根元素。在這個div內,我們定義了一個data-role為header和footer的div,分別表示頁面的頭部和底部,并分別放置一些文本。content部分則包含頁面的主體內容,這里我們放置了一個簡單的段落。通過這樣的方式,我們就可以快速創建一個簡單的jQuery Mobile頁面。
上一篇點擊后保留樣式css
下一篇點擊后表格變色css