jQuery Mobile has a rich theming system that gives you full control of how pages and forms are styled. By default all form elements inside a container will automatically adopt the same theme color swatch as their parent. This allows form elements to blend into their layouts with minimal work. The data-theme attribute can be applied any individual form element to apply any of the lettered theme color swatches to create contrast and emphasis in your designs.
All the form elements in the examples below use the same HTML code with no theme swatch specified on the individual form elements. The only difference between each example block code is a data-theme swatch color assigned to each parent container. This illustrates the way form elements automatically adopt the theme swatch of their parent.