ui-icon
class, and position the icon with an icon position class ui-btn-icon-pos
.
<a href="#anylink" class="ui-btn ui-icon-info ui-btn-icon-left">Info</a>jQuery Mobile provides many number of icons.
Class | Description |
---|---|
ui-icon-home | Home Icon |
ui-icon-info | Information Icon |
ui-icon-delete | Delete Icon |
ui-icon-back | Back Icon |
ui-icon-audio | Speakers |
ui-icon-grid | Grid Icon |
ui-icon-alert | Alert Icon |
ui-icon-search | Search Icon |
ui-icon-lock | Padlock |
ui-icon-arrow-l | Left Arrow |
ui-icon-arrow-r | Right Arrow |
ui-btn-icon-position
class to specify the position.
Eg:
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-top">Top</a> <a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-right">Right</a> <a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-bottom">Bottom</a> <a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left">Left</a>
"notext"
as value for icon position.
Eg:
<a href="#anylink" class="ui-btn ui-icon-info ui-btn-icon-notext">Info</a>
ui-nodisc-icon
class to the element or its container.
Eg:
<a href="#anylink" class="ui-btn ui-icon-info ui-btn-icon-left">Circle (default)</a> <a href="#anylink" class="ui-btn ui-icon-info ui-btn-icon-left ui-nodisc-icon">No Circle</a>
ui-alt-icon
to the element or its container.
Eg:
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left">White</a> <a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left ui-alt-icon">Black</a>