icon(图标)

mui默认提供了手机App开发常用的字体图标，如下：(点击icon即可复制样式)

• mui-icon-contact
• mui-icon-person
• mui-icon-personadd
• mui-icon-phone
• mui-icon-email
• mui-icon-chatbubble
• mui-icon-chatboxes
• mui-icon-weibo
• mui-icon-weixin
• mui-icon-pengyouquan
• mui-icon-chat
• mui-icon-qq
• mui-icon-videocam
• mui-icon-camera
• mui-icon-image
• mui-icon-mic
• mui-icon-micoff
• mui-icon-location
• mui-icon-map
• mui-icon-compose
• mui-icon-trash
• mui-icon-upload
• mui-icon-download
• mui-icon-close
• mui-icon-closeempty
• mui-icon-redo
• mui-icon-undo
• mui-icon-refresh
• mui-icon-refreshempty
• mui-icon-reload
• mui-icon-loop
• mui-icon-spinner mui-spin
• mui-icon-spinner-cycle mui-spin
• mui-icon-star
• mui-icon-starhalf
• mui-icon-plus
• mui-icon-plusempty
• mui-icon-minus
• mui-icon-checkmarkempty
• mui-icon-search
• mui-icon-home
• mui-icon-navigate
• mui-icon-gear
• mui-icon-settings
• mui-icon-list
• mui-icon-bars
• mui-icon-paperplane
• mui-icon-info
• mui-icon-help
• mui-icon-locked
• mui-icon-more
• mui-icon-locked
• mui-icon-flag
• mui-icon-paperclip
• mui-icon-back
• mui-icon-forward
• mui-icon-arrowup
• mui-icon-arrowdown
• mui-icon-arrowleft
• mui-icon-arrowright
• mui-icon-arrowthinup
• mui-icon-arrowthindown
• mui-icon-arrowthinleft
• mui-icon-arrowthinright
• mui-icon-pulldown

使用时，只需要在span节点上分别增加.mui-icon、.mui-icon-name两个类即可（name为图标名称，例如：weixin、weibo等），如下代码即可显示一个微信图标：

  <span class="mui-icon mui-icon-weixin"></span>

关联阅读

• mui如何增加自定义icon图标
• mui扩展字体

#iconlist:before{ height: 0; } #iconlist:after{ height: 0 } #iconlist li.mui-table-view-cell{ padding: 10px; border: 1px solid #fff; background-color:#f9f9f9; } #iconlist .mui-table-view-cell:hover:after{ height: 4px; background-color:#d64c28; left:0; } #iconlist li.mui-table-view-cell .mui-media-body{ word-wrap:break-word; height: 30px; }

扩展阅读

代码块激活字符 micon