diff --git a/src/components/demo/GithubLink/index.vue b/src/components/demo/GithubLink/index.vue
index 3c4734a0..353f41c5 100644
--- a/src/components/demo/GithubLink/index.vue
+++ b/src/components/demo/GithubLink/index.vue
@@ -2,7 +2,7 @@
   <el-tooltip :content="url" :placement="tooltipPlacement">
     <a :href="url" target="_blank" class="link">
       View in Github
-      <span class="fa fa-github"></span>
+      <i class="fa fa-github"></i>
     </a>
   </el-tooltip>
 </template>
diff --git a/src/components/demo/GithubLinkButton/index.vue b/src/components/demo/GithubLinkButton/index.vue
index 3fd25e6e..1c31179b 100644
--- a/src/components/demo/GithubLinkButton/index.vue
+++ b/src/components/demo/GithubLinkButton/index.vue
@@ -6,7 +6,7 @@
       width="160"
       v-model="popover.visible">
       <p class="dd-mt-0 dd-mb-10">
-        <span class="fa fa-github"></span>
+        <i class="fa fa-github"></i>
         github
       </p>
       <p class="dd-mt-0 dd-mb-10" style="font-size: 10px;">{{name}}</p>
@@ -22,7 +22,7 @@
     <el-button
       v-popover:pop
       v-bind="$attrs">
-      <span class="fa fa-github"></span>
+      <i class="fa fa-github"></i>
       {{name}}
     </el-button>
   </div>
diff --git a/src/pages/demo/plugins/font-awesome/components/IconCell.vue b/src/pages/demo/plugins/font-awesome/components/IconCell.vue
index 2c1ba224..ddd03e53 100644
--- a/src/pages/demo/plugins/font-awesome/components/IconCell.vue
+++ b/src/pages/demo/plugins/font-awesome/components/IconCell.vue
@@ -7,7 +7,7 @@
       width="300"
       trigger="hover">
       <div class="icon-group">
-        <span :class="'fa fa-' + icon"></span>
+        <i :class="'fa fa-' + icon"></i>
       </div>
       <el-row :gutter="10">
         <el-col :span="12">
@@ -23,7 +23,7 @@
       </el-row>
     </el-popover>
     <el-tag type="info" v-popover:pop>
-      <span :class="'fa fa-' + icon"></span>
+      <i :class="'fa fa-' + icon"></i>
     </el-tag>
     <span style="font-size: 10px;">{{icon}}</span>
   </div>