diff --git a/examples/components/string-html.vue b/examples/components/string-html.vue
new file mode 100644
index 0000000..4d95a67
--- /dev/null
+++ b/examples/components/string-html.vue
@@ -0,0 +1,27 @@
+<template>
+  <div>
+    <!-- 通过slot拿到html标签内容，渲染后删除slot -->
+    <span ref="raw" style="display: none;"><slot></slot></span>
+    <!-- 解析获取到的html字符串为html标签 -->
+    <div v-html="nodeHtml"></div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'stringHtml',
+  data() {
+    return {
+      nodeHtml: ''
+    };
+  },
+  mounted() {
+    const { $slots = {} } = this;
+    const defaultNodes = $slots.default || {};
+    const vnode = defaultNodes[0] || {};
+    const { elm = {} } = vnode;
+    this.nodeHtml = elm.innerText;
+    this.$refs.raw.parentNode.removeChild(this.$refs.raw);
+  }
+}
+</script>
\ No newline at end of file
diff --git a/examples/main.js b/examples/main.js
index 1dd7f7b..82b4b8c 100644
--- a/examples/main.js
+++ b/examples/main.js
@@ -8,6 +8,7 @@ import ElementUI from 'element-ui';
 import EagleWebToolkit from '../packages';
 import NProgress from 'nprogress';
 import EagleCodeSnippet from "@/components/code-snippet";
+import EagleStringHtml from "@/components/string-html";
 
 import '@/styles/index.scss';
 import "highlight.js/styles/github.css";
@@ -49,6 +50,7 @@ NProgress.configure({ showSpinner: false });
 
 // 注册代码片段组件
 Vue.component("eagle-code-snippet", EagleCodeSnippet);
+Vue.component("eagle-string-html", EagleStringHtml);
 // 注册饿了么UI
 Vue.use(ElementUI);
 // 注册Eagle组件库
diff --git a/examples/views/docs/guide/introduce.md b/examples/views/docs/guide/introduce.md
index 449b208..7766a5c 100644
--- a/examples/views/docs/guide/introduce.md
+++ b/examples/views/docs/guide/introduce.md
@@ -6,6 +6,10 @@
 
 额
 
-::: html 啊啊啊
-<span>123123</span>
+::: html
+<div style="display: flex; align-items: center;">
+  <img src="/img/logo.svg" style="width: 100px;" />
+  <i class="el-icon-plus" style="padding: 0 20px;"></i>
+  <img src="/img/vue.svg" style="width: 100px;" />
+</div>
 :::
\ No newline at end of file
diff --git a/examples/views/layout/components/header.vue b/examples/views/layout/components/header.vue
index e64b680..6380a5b 100644
--- a/examples/views/layout/components/header.vue
+++ b/examples/views/layout/components/header.vue
@@ -1,7 +1,7 @@
 <template>
   <el-header class="layout-header">
     <div class="left">
-      <img class="logo" src="@/assets/logo.svg" />
+      <img class="logo" src="/img/logo.svg" />
       <span class="title">EAGLE WEB TOOLKIT</span>
     </div>
     <el-menu :default-active="activeMenu" mode="horizontal" @select="handleSelect">
diff --git a/public/img/logo.svg b/public/img/logo.svg
new file mode 100644
index 0000000..8a72aad
--- /dev/null
+++ b/public/img/logo.svg
@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="453px" height="399px" viewBox="0 0 453 399" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 55.2 (78181) - https://sketchapp.com -->
+    <title>扁平化</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <filter x="-7.2%" y="-8.3%" width="114.4%" height="116.5%" filterUnits="objectBoundingBox" id="filter-1">
+            <feOffset dx="4" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="6" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.1 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
+            <feMerge>
+                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+                <feMergeNode in="SourceGraphic"></feMergeNode>
+            </feMerge>
+        </filter>
+        <linearGradient x1="50%" y1="0.379466195%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#F1BC57" offset="0%"></stop>
+            <stop stop-color="#F88F85" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#F1BC57" offset="0%"></stop>
+            <stop stop-color="#F88F85" offset="100%"></stop>
+        </linearGradient>
+        <radialGradient cx="34.4433962%" cy="6.0128409%" fx="34.4433962%" fy="6.0128409%" r="260.516355%" gradientTransform="translate(0.344434,0.060128),scale(0.718720,1.000000),rotate(70.057477),translate(-0.344434,-0.060128)" id="radialGradient-4">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#F5F5F5" offset="100%"></stop>
+        </radialGradient>
+        <linearGradient x1="50%" y1="99.8417616%" x2="50%" y2="0.0685762192%" id="linearGradient-5">
+            <stop stop-color="#2F54EB" offset="0.0897381757%"></stop>
+            <stop stop-color="#0089EF" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="页面1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="画板" transform="translate(-317.000000, -377.000000)" fill-rule="nonzero">
+            <g id="扁平化" filter="url(#filter-1)" transform="translate(325.000000, 389.000000)">
+                <path d="M252.331417,374.638438 C260.587417,373.794438 266.243417,363.958438 270.047417,352.550438 C250.679417,352.826438 230.715417,350.642438 210.855417,344.862438 C220.987417,357.330438 238.631417,376.038438 252.331417,374.638438 Z" id="路径" fill="url(#linearGradient-2)"></path>
+                <path d="M135.699417,75.9024384 L80.2874166,63.4744384 C80.2874166,63.4744384 43.9594166,50.7824384 1.80741662,118.742438 C-2.32858338,125.410438 1.15541662,134.394438 6.99141662,132.070438 C19.2474166,127.194438 36.7634166,123.282438 56.4354166,128.242438 L105.511417,145.398438 C112.963417,119.886438 124.011417,95.8824384 135.699417,75.9024384 L135.699417,75.9024384 Z" id="路径" fill="url(#linearGradient-3)"></path>
+                <path d="M365.083417,127.654438 C365.155417,125.302438 365.103417,122.958438 364.975417,120.622438 L376.771417,131.650438 C378.163417,132.950438 380.287417,131.262438 379.311417,129.626438 C372.587417,118.330438 365.303417,103.374438 359.815417,91.5304384 L378.975417,92.1504384 C380.807417,92.2104384 381.339417,89.6864384 379.639417,88.9984384 C367.995417,84.2864384 359.063417,77.0104384 353.655417,71.7984384 C358.343417,71.4304384 370.911417,69.5824384 380.879417,68.8744384 C382.559417,68.7544384 383.007417,66.5064384 381.491417,65.7704384 C363.879417,57.1864384 338.903417,42.8144384 333.331417,39.5864384 C332.575417,39.1504384 331.859417,38.6944384 331.135417,38.2024384 L324.983417,34.0064384 C314.871417,23.6144384 302.251417,14.2824384 286.531417,7.87843838 C243.707417,-9.53756162 194.435417,2.69443838 163.371417,36.9344384 C138.531417,64.3824384 103.611417,125.142438 97.1714166,186.458438 L100.187417,190.998438 C102.995417,195.234438 108.715417,196.322438 112.919417,193.498438 L124.023417,185.966438 C127.035417,183.934438 130.939417,183.854438 133.975417,185.738438 L153.443417,197.798438 C156.639417,199.778438 160.787417,199.590438 163.791417,197.286438 L178.423417,186.246438 C181.999417,183.514438 187.023417,183.818438 190.287417,186.894438 L193.947417,190.390438 C199.811417,195.986438 208.687417,196.986438 215.651417,192.834438 L226.343417,186.454438 C230.163417,184.178438 235.023417,184.954438 237.915417,188.278438 L248.303417,200.142438 C251.291417,203.522438 256.323417,204.234438 260.127417,201.770438 L275.207417,192.058438 C278.831417,189.726438 283.591417,190.242438 286.627417,193.302438 L295.575417,202.310438 C298.823417,205.550438 303.943417,205.914438 307.603417,203.190438 L320.403417,193.554438 C324.123417,190.734438 329.363417,191.178438 332.535417,194.542438 L338.531417,200.842438 C341.883417,204.410438 347.411417,204.678438 351.127417,201.506438 L363.635417,190.858438 C363.387417,186.806438 363.335417,182.790438 363.467417,178.754438 L365.083417,127.654438 Z" id="路径" fill="url(#radialGradient-4)"></path>
+                <path d="M431.051417,300.962438 C431.051417,300.962438 261.063417,415.810438 136.863417,302.926438 C101.779417,271.034438 92.7354166,228.642438 97.1794166,186.458438 L100.195417,190.998438 C103.003417,195.234438 108.723417,196.322438 112.927417,193.498438 L124.031417,185.966438 C127.043417,183.934438 130.947417,183.854438 133.983417,185.738438 L153.451417,197.798438 C156.647417,199.778438 160.795417,199.590438 163.799417,197.286438 L178.431417,186.246438 C182.007417,183.514438 187.031417,183.818438 190.295417,186.894438 L193.955417,190.390438 C199.815417,195.990438 208.703417,196.986438 215.655417,192.834438 L226.351417,186.450438 C230.171417,184.174438 235.031417,184.950438 237.923417,188.274438 L248.311417,200.138438 C251.299417,203.518438 256.331417,204.230438 260.135417,201.766438 L275.215417,192.054438 C278.855417,189.710438 283.607417,190.246438 286.655417,193.314438 L295.583417,202.306438 C298.831417,205.546438 303.951417,205.910438 307.611417,203.186438 L320.411417,193.550438 C324.131417,190.730438 329.371417,191.174438 332.543417,194.538438 L338.539417,200.838438 C341.891417,204.406438 347.419417,204.674438 351.135417,201.502438 L363.643417,190.854438 C365.383417,223.118438 378.127417,254.094438 400.635417,277.582438 C417.179417,294.866438 431.051417,300.962438 431.051417,300.962438 L431.051417,300.962438 Z" id="路径" fill="url(#linearGradient-5)"></path>
+                <path d="M224.21741,71.83259 C226.04941,71.83259 227.70141,70.56859 228.11741,68.70859 C228.60141,66.55259 227.24541,64.41659 225.08941,63.93259 L169.40141,51.44859 C167.26541,50.97659 165.10941,52.32459 164.62541,54.47659 C164.14141,56.63259 165.49741,58.76859 167.65341,59.25259 L194.09741,65.18059 C193.33741,65.65259 192.56541,66.08459 191.85341,66.66459 C182.95741,73.93659 181.64141,87.04059 188.91341,95.93659 C196.18541,104.83259 209.28941,106.14859 218.18541,98.87659 C226.47341,92.10059 228.08141,80.30459 222.39741,71.52459 L223.34141,71.73659 C223.63341,71.80459 223.92541,71.83259 224.21741,71.83259 L224.21741,71.83259 Z" id="路径" fill="#233333"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/public/img/vue.svg b/public/img/vue.svg
new file mode 100644
index 0000000..52a2a47
--- /dev/null
+++ b/public/img/vue.svg
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="400px" height="350px" viewBox="0 0 400 350" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 55.2 (78181) - https://sketchapp.com -->
+    <title>Vue</title>
+    <desc>Created with Sketch.</desc>
+    <g id="页面1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="画板" transform="translate(-266.000000, -523.000000)">
+            <g id="Vue" transform="translate(266.000000, 523.000000)">
+                <polygon id="路径" fill="#44BC84" points="80 0 200 210 320 0 400 0 200 350 0 0"></polygon>
+                <polygon id="路径" fill="#344C5C" points="155.33049 0 200.426439 80 245.522388 0 320.682303 0 200.426439 210 80.1705757 0"></polygon>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/webpack/markdown-loader.js b/webpack/markdown-loader.js
index 9a8ccf4..0987f2e 100644
--- a/webpack/markdown-loader.js
+++ b/webpack/markdown-loader.js
@@ -76,10 +76,10 @@ module.exports = function(source) {
         componentCodeList.push(`"${name}":(function () {
           ${code}
           ${script}
-           return {
-             ...exportJavaScript,
-             render,
-             staticRenderFns
+          return {
+            ...exportJavaScript,
+            render,
+            staticRenderFns
           }
         })()`);
         // 将需要渲染的示例用eagle-code-snippet组件包裹替换插槽显示示例效果
@@ -99,13 +99,11 @@ module.exports = function(source) {
       return params.trim().match(/^html\s*(.*)$/);
     },
     // 代码块渲染
-    render(tokens, idx) {
-      var m = tokens[idx].info.trim().match(/^html\s+(.*)$/);
-      if (tokens[idx].nesting === 1) {
-        return `<div> ${markdownIt.utils.escapeHtml(m[1])}`;
-      } else {
-        return '</div>';
+    render(tokens, index) {
+      if (tokens[index].nesting === 1) {
+        return `<eagle-string-html>`;
       }
+      return `</eagle-string-html>`;
     }
   });
   // 将所有转换好的代码字符串拼接成vue单组件template、script、style格式
--
libgit2 0.21.0