微信（wechat）的选项卡中第三项包含了一个红色的信息元素，被称为徽章： 
要在.tab-item内包含徽章，需要注意两点： - 使用.badge样式插入徽章元素
- 在.tab-item同级声明.has-badge样式
- <any class="tabs">
- <any class="tab-item has-badge">
- <any class="badge">...</any>
- </any>
- ...
- </any>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width,height=device-height">
<link rel="stylesheet" type="text/css" href="ionic.min.css">
</head>
<body class="stable-bg">
<div class="bar bar-header bar-dark">
<h1 class="title">微信</h1>
<a class="button button-clear icon ion-ios-plus-empty"></a>
</div>
<div class="tabs tabs-dark tabs-icon-top">
<a class="tab-item active">
<i class="icon ion-ios-chatbubble-outline"></i>微信
</a>
<a class="tab-item">
<i class="icon ion-ios-paper-outline"></i>通信录
</a>
<a class="tab-item has-badge">
<i class="icon ion-ios-eye-outline"></i>发现
<i class="badge">12</i>
</a>
<a class="tab-item">
<i class="icon ion-ios-person-outline"></i>我
</a>
</div>
</body>
</html>
| 
/1 
