Button markup

Add classes to style a and button elements. input buttons are enhanced by the button widget. See this page for examples.

Note that in 1.4 data- attributes will still work. The deprecated buttonMarkup method will add the applicable classes to a (with data-role="button") and button elements. This method also adds the role="button" attribute to anchor elements.

Quick Links

Basic markup

Anchor
Top

Corners

Anchor

Icon-only buttons are round by default. Here we show how you can set the same border-radius as other buttons.

No text
Top

Shadow

Anchor
Top

Inline

Anchor
Top

Theme

Anchor - Inherit Anchor - Theme swatch A Anchor - Theme swatch B
Top

Mini

Anchor
Top

Icons

Anchor
Top

Icon position

Left Right Top Bottom Icon only

Inline:

Left Right Top Bottom Icon only
Top

Icon shadow

Note: This styling option is deprecated in jQuery Mobile 1.4.0 and will be removed in 1.5.0. Accordingly, we changed the default for framework-enhanced buttons to false.

Anchor

Theme B:

Top

Disabled

Disabled anchor via class
Top

Native button

In 1.4 button will still be auto-enhanced. This example shows how you can prevent this.