* update document files.

docs/part/basic-colorset.md

@@ -86,9 +86,9 @@ ZUI的配色表包含三部分：主要颜色，灰度颜色及额外颜色。
   <div class="color-special-pale" data-color="specialPale"></div>
 </div>
 
-## 在JS中使用获取配色表
+## 在JS中使用配色表
 
-你可以在Javascript代码中获取和使用这些配色。具体用法参考章节[配色表](#javascript/colorset)。
+你可以在Javascript代码中获取和使用这些配色。具体用法参考章节[配色表](#javascript/color)。
 
 ## 配色设计要点
 

docs/part/basic-grid.md

@@ -25,7 +25,7 @@ filter: zhagexitong zgxt
     <tr>
       <th class="text-nowrap">栅格系统行为</th>
       <td>总是水平排列</td>
-      <td colspan="3">开始是堆叠在一起的，当大于这些阈值时将变为水平排列C</td>
+      <td colspan="3">开始是堆叠在一起的，当大于这些阈值时将变为水平排列</td>
     </tr>
     <tr>
       <th class="text-nowrap"><code>.container</code> 最大宽度</th>

docs/part/basic-ie.md

@@ -22,7 +22,7 @@ filter: jianrongieliulanqi jriellq
   ...
 ```
 
-## 提示IE7及更早的用户
+## 提示IE7及更早版本的用户
 
 针对IE7及更早的版本，应该给出提示，让用户升级浏览器。在`body`之后加入以下代码可以有选择性的出现浏览器升级提示，并给出链接引导用户访问[browsehappy.com](http://browsehappy.com/)：
 

docs/part/basic-typography.md

@@ -45,61 +45,61 @@ filter: paiban pb
       <th>说明</th>
     </tr>
     <tr>
-      <td># 页面标题</td>
+      <td><h1>页面标题</h1></td>
       <td>`<h1>`</h1></td>
       <td>26px</td>
       <td>在一个页面只有一个页面标题。</td>
     </tr>
     <tr>
-      <td>## 标题</td>
+      <td><h2>标题</h2></td>
       <td>`<h2>`</h2></td>
       <td>22px</td>
       <td>作为页面第二级标题，可能在一个页面中使用到多个二级标题。</td>
     </tr>
     <tr>
-      <td>### 三级标题</td>
+      <td><h3>三级标题</h3></td>
       <td>`<h3>`</h3></td>
       <td>16px 粗体</td>
       <td>页面第三级标题，嵌套在二级标题下使用。</td>
     </tr>
     <tr>
-      <td>#### 四级标题</td>
+      <td><h4>四级标题</h4></td>
       <td>`<h4>`</h4></td>
       <td>15px 粗体</td>
       <td>页面第四级标题，嵌套在三级标题下使用。</td>
     </tr>
     <tr>
-      <td>##### 五级标题</td>
+      <td><h5>五级标题</h5></td>
       <td>`<h5>`</h5></td>
       <td>13px 粗体 颜色灰色</td>
       <td>页面第五级标题，嵌套在四级标题下使用。</td>
     </tr>
     <tr>
-      <td>###### 六级标题</td>
+      <td><h6>六级标题</h6></td>
       <td>`<h6>`</h6></td>
       <td>12px 粗体 颜色灰色</td>
       <td>页面第六级标题，嵌套在五级标题下使用。</td>
     </tr>
     <tr>
-      <td>这是一个段落</td>
+      <td><p>这是一个段落</p></td>
       <td>`<p>`</p></td>
       <td>13px</td>
       <td>正文中大部分由段落组成。段落的行高为20px。段落间在垂直方向上有10px边距。</td>
     </tr>
     <tr>
-      <td>这是一个突出的段落</td>
+      <td><p class="lead">这是一个突出的段落</p></td>
       <td>`<p class="lead">`</p></td>
       <td>20px</td>
       <td>突出的段落具有更大的字体，在一个段落上加`.lead`类。</td>
     </tr>
     <tr>
-      <td>**粗体文本**</td>
+      <td><strong>粗体文本</strong></td>
       <td>`<strong>`</strong></td>
       <td>13px</td>
       <td>通常粗体文本用来强调内容。</td>
     </tr>
     <tr>
-      <td>_斜体文本_</td>
+      <td><em>强调文本</em></td>
       <td>`<em>`</em></td>
       <td>13px</td>
       <td></td>
@@ -117,24 +117,32 @@ filter: paiban pb
       <td>超链接具有不同的颜色以区别其他文本，超链接仅当鼠标悬停时会增加下划线。</td>
     </tr>
     <tr>
-      <td>1.  这是一个有序列表
-2.包含三个列表项
-3.作为示例</td>
+      <td>
+        <ol>
+          <li>这是一个有序列表</li>
+          <li>含三个列表项</li>
+          <li>作为示例</li>
+        </ol>
+      </td>
       <td>`<ol><li>...</li></ol>`</td>
       <td>13px</td>
       <td>当组织一些并列项目且关注项目之间顺序时可以使用有序列表。</td>
     </tr>
     <tr>
-      <td>*   这是一个无序列表
-*   包含三个列表项
-*   作为示例</td>
+      <td>
+        <ul>
+          <li>这是一个无序列表</li>
+          <li>含三个列表项</li>
+          <li>作为示例</li>
+        </ul>
+      </td>
       <td>`<ul><li>...</li></ul>`</td>
       <td>13px</td>
       <td>当组织一些并列项目但不关注项目之间顺序时可以使用无序列表。</td>
     </tr>
     <tr>
-      <td>&gt; 这是一大段引用内容</td>
-      <td>`<blockquote>`</blockquote></td>
+      <td><blockquote>这是一大段引用内容</blockquote></td>
+      <td>`<blockquote>`</td>
       <td>13px</td>
       <td>用于显示一大段引用的内容。</td>
     </tr>

docs/part/component-panel.md

@@ -63,7 +63,7 @@ filter: mianban mb
 </div>
 ```
 
-## 使用不同色彩主题
+## 色彩主题
 
 <div class="example">
   <div class="panel panel-primary">

docs/part/control-header.md

@@ -22,37 +22,37 @@ filter: duojibiaoti djbt
   </thead>
   <tbody>
     <tr>
-      <td># Heading1 一级标题</td>
+      <td><h1>Heading1 一级标题</h1></td>
       <td>`<h1>`</h1></td>
       <td>20px</td>
       <td>在一个页面（或在`hgroup`标记的范围内）只有一个页面标题。</td>
     </tr>
     <tr>
-      <td>## Heading2 二级标题</td>
+      <td><h2>Heading2 二级标题</h2></td>
       <td>`<h2>`</h2></td>
       <td>24px</td>
       <td>作为页面第二级标题，可能在一个页面中使用到多个二级标题。</td>
     </tr>
     <tr>
-      <td>### Heading3 三级标题</td>
+      <td><h3>Heading3 三级标题</h3></td>
       <td>`<h3>`</h3></td>
       <td>16px 粗体</td>
       <td>页面第三级标题，嵌套在二级标题下使用。</td>
     </tr>
     <tr>
-      <td>#### Heading4 四级标题</td>
+      <td><h4>Heading4 四级标题</h4></td>
       <td>`<h4>`</h4></td>
       <td>14px 粗体</td>
       <td>页面第四级标题，嵌套在三级标题下使用。</td>
     </tr>
     <tr>
-      <td>##### Heading5 五级标题</td>
+      <td><h5>Heading5 五级标题</h5></td>
       <td>`<h5>`</h5></td>
       <td>13px 粗体 颜色灰色</td>
       <td>页面第五级标题，嵌套在四级标题下使用。</td>
     </tr>
     <tr>
-      <td>###### Heading6 六级标题</td>
+      <td><h6>Heading6 六级标题</h6></td>
       <td>`<h6>`</h6></td>
       <td>12px 粗体 颜色灰色</td>
       <td>页面第六级标题，嵌套在五级标题下使用。</td>
@@ -60,13 +60,28 @@ filter: duojibiaoti djbt
   </tbody>
 </table>
 
-```
+```html
 <h1>Heading1 一级标题</h1>
-<h1>Heading2 二级标题</h1>
-<h1>Heading3 三级标题</h1>
-<h1>Heading4 四级标题</h1>
-<h1>Heading5 五级标题</h1>
-<h1>Heading6 六级标题</h1>
+```
+
+```html
+<h2>Heading2 二级标题</h2>
+```
+
+```html
+<h3>Heading3 三级标题</h3>
+```
+
+```html
+<h4>Heading4 四级标题</h4>
+```
+
+```html
+<h5>Heading5 五级标题</h5>
+```
+
+```html
+<h6>Heading6 六级标题</h6>
 ```
 
 ## 包含副标题
@@ -82,18 +97,47 @@ filter: duojibiaoti djbt
   <h6>Heading6 标题6 <small>副标题 secondary headings</small></h6>
 </div>
 
+```html
+<h1>Heading1 标题1 <small>副标题</small></h1>
+```
+
+```html
+<h1>Heading2 标题2 <small>副标题</small></h2>
+```
+
+```html
+<h1>Heading3 标题3 <small>副标题</small></h3>
+```
+
+```html
+<h1>Heading4 标题4 <small>副标题</small></h4>
+```
+
+```html
+<h1>Heading5 标题5 <small>副标题</small></h5>
 ```
-<h1>Heading1 标题 <small>副标题</small></h1>
+
+```html
+<h1>Heading6 标题6 <small>副标题</small></h6>
 ```
 
 ## 带底部水平分隔线的标题
 
-`.header-dividing`
+使用 `.header-dividing` 或 `.page-header`。
 
 <div class="example" contenteditable="true">
   <h3 class="header-dividing">标题</h3>
+  <div class="page-header">
+    <h2>使用 <span class="code">.page-header</span></h2>
+  </div>
 </div>
 
-```
+```html
 <h1 class="header-dividing">Heading1 一级标题</h1>
 ```
+
+```html
+<div class="page-header">
+  <h2>使用 <span class="code">.page-header</span></h2>
+</div>
+```

docs/part/control-label.md

@@ -18,7 +18,7 @@ filter: biaoqian bq
 <span class="label">标签</span>
 ```
 
-## 标签和徽标的颜色
+## 颜色主题
 
 <div class="example">
   <span class="label">Default</span>
@@ -53,7 +53,7 @@ filter: biaoqian bq
 <span class="label label-danger">Danger</span>
 ```
 
-## 徽标
+## 作为徽标
 
 `.label-badge`