css：
<style type="text/css"> .nav-glyphish-example .ui-btn .ui-btn-inner { padding-top: 40px !important; } .nav-glyphish-example .ui-btn .ui-icon { 30px!important; height: 30px!important; margin-left: -15px !important; box-shadow: none!important; -moz-box-shadow: none!important; -webkit-box-shadow: none!important; -webkit-border-radius: none !important; border-radius: none !important; } #chat .ui-icon { background: url(glyphish-icons/09-chat2.png) 50% 50% no-repeat; background-size: 24px 22px; } #email .ui-icon { background: url(glyphish-icons/18-envelope.png) 50% 50% no-repeat; background-size: 24px 16px; } #login .ui-icon { background: url(glyphish-icons/30-key.png) 50% 50% no-repeat; background-size: 12px 26px; } #beer .ui-icon { background: url(glyphish-icons/88-beermug.png) 50% 50% no-repeat; background-size: 22px 27px; } #coffee .ui-icon { background: url(glyphish-icons/100-coffee.png) 50% 50% no-repeat; background-size: 20px 24px; } #skull .ui-icon { background: url(glyphish-icons/21-skull.png) 50% 50% no-repeat; background-size: 22px 24px; }</style>page：
<div data-role="footer" class="nav-glyphish-example"> <div data-role="navbar" class="nav-glyphish-example" data-grid="d"> <ul> <li><a href="#" id="chat" data-icon="custom">Chat</a></li> <li><a href="#" id="email" data-icon="custom">Email</a></li> <li><a href="#" id="skull" data-icon="custom">Danger</a></li> <li><a href="#" id="beer" data-icon="custom">Beer</a></li> <li><a href="#" id="coffee" data-icon="custom">Coffee</a></li> </ul> </div></div>