Now it’s the time to get deeper into the content area of our webapp. The most
important thing to know is that any HTML code will work inside
Every theme of jQuery Mobile includes nice styles with padding,
margins, sizes, and colors for every standard element optimized for the
current theme and mobile device. That includes styles for
hX elements, links, bold and emphasized text,
citations, lists, and tables.
If we are going to provide our own CSS styles for the content, we need to be aware of the theming system to avoid UI problems if we change the theme. More about theming and customization later in this book.
Apart from basic HTML elements, there are some components provided
by the framework that are defined using
data-role. In the header and footer, as we saw
before, some elements such as
a have automatic component rendering
behavior. That is not the case with the contents area, except from some
form elements, as we are going to see in Chapter 5.
In Figure 3-13 you can see how jQuery Mobile renders some basic HTML elements using the default theme.
Figure 3-13. Some basic HTML elements rendered using the default theme