<div data-role="page"> <div data-role="header"><h1>Header</h1></div> <div data-role="content" id="content"> <p>Images</p> <img src="../images/flower.jpg" /> </div> <div data-role="footer"><h4>Footer</h4></div> </div>
Mobile pages are composed of three main parts: the header, the footer, and content between them. All three are not necessarily required, but it is a good idea to at least have a header with the content, especially when working with multiple pages.
All these elements are defined by adding data-role attributes to
<div> elements. The content inside the
<div> elements can be just about anything, including text, images, forms, and lists.
The following code shows ...