diff --git a/bi/core.css b/bi/core.css
index 5ae82a56d8..9d2ea47015 100644
--- a/bi/core.css
+++ b/bi/core.css
@@ -3043,6 +3043,10 @@ i {
 .bi-high-light {
   color: #3f8ce8;
 }
+.bi-high-light-background {
+  background-color: #3f8ce8;
+  color: #ffffff;
+}
 .bi-water-mark {
   color: #cccccc;
   cursor: text;
@@ -3060,12 +3064,8 @@ i {
   background: #ffffff;
 }
 .bi-z-index-mask {
-  background-color: #1a1a1a;
-  opacity: 0.5;
-  filter: alpha(opacity=50);
-}
-.bi-theme-dark .bi-z-index-mask {
-  background-color: #ffffff;
+  background-color: rgba(26, 26, 26, 0.5);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f1a1a1a,endColorstr=#7f1a1a1a);
 }
 .bi-list-item:hover,
 .bi-list-item.hover {
diff --git a/docs/core.css b/docs/core.css
index 5ae82a56d8..9d2ea47015 100644
--- a/docs/core.css
+++ b/docs/core.css
@@ -3043,6 +3043,10 @@ i {
 .bi-high-light {
   color: #3f8ce8;
 }
+.bi-high-light-background {
+  background-color: #3f8ce8;
+  color: #ffffff;
+}
 .bi-water-mark {
   color: #cccccc;
   cursor: text;
@@ -3060,12 +3064,8 @@ i {
   background: #ffffff;
 }
 .bi-z-index-mask {
-  background-color: #1a1a1a;
-  opacity: 0.5;
-  filter: alpha(opacity=50);
-}
-.bi-theme-dark .bi-z-index-mask {
-  background-color: #ffffff;
+  background-color: rgba(26, 26, 26, 0.5);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f1a1a1a,endColorstr=#7f1a1a1a);
 }
 .bi-list-item:hover,
 .bi-list-item.hover {
diff --git a/docs/resource.css b/docs/resource.css
index f3b24fcc8f..f147b4cd55 100644
--- a/docs/resource.css
+++ b/docs/resource.css
@@ -1025,7 +1025,7 @@ textarea::-webkit-scrollbar-thumb {
 .dot-ha-font:focus .b-font:before,
 .dot-ha-font.hover .b-font:before {
   content: "\e606";
-  color: #f4f4f4;
+  color: #999999;
 }
 .dot-ha-font:active .b-font:before,
 .dot-ha-font.active .b-font:before {
@@ -1045,7 +1045,7 @@ textarea::-webkit-scrollbar-thumb {
 .dot-e-font:focus .b-font:before,
 .dot-e-font.hover .b-font:before {
   content: "\e606";
-  color: #f4f4f4;
+  color: #999999;
 }
 .dot-e-font.active .b-font:before {
   content: "\e606";
@@ -2856,12 +2856,12 @@ textarea::-webkit-scrollbar-thumb {
 }
 .group-add-font .b-font:before {
   content: "\e649";
-  color: #808080;
+  color: #999999;
 }
 .group-add-font.native .b-font:before,
 .group-add-font.disabled .b-font:before {
   content: "\e649";
-  color: #808080;
+  color: #999999;
 }
 .sortable-font .b-font:before {
   content: "\e63b";
@@ -3256,7 +3256,7 @@ textarea::-webkit-scrollbar-thumb {
 .data-link-check-font:focus .b-font:before,
 .data-link-check-font.hover .b-font:before {
   content: "\e611";
-  color: #f4f4f4;
+  color: #999999;
 }
 .data-link-check-font:active .b-font:before,
 .data-link-check-font.active .b-font:before {
@@ -3361,7 +3361,7 @@ textarea::-webkit-scrollbar-thumb {
 .item-check-font:focus .b-font:before,
 .item-check-font.hover .b-font:before {
   content: "\e611";
-  color: #f4f4f4;
+  color: #999999;
 }
 .item-check-font:active .b-font:before,
 .item-check-font.active .b-font:before {
diff --git a/src/css/core/utils/common.css b/src/css/core/utils/common.css
index 331bbec99e..028c37ac3c 100644
--- a/src/css/core/utils/common.css
+++ b/src/css/core/utils/common.css
@@ -90,6 +90,10 @@
 .bi-high-light {
   color: #3f8ce8;
 }
+.bi-high-light-background {
+  background-color: #3f8ce8;
+  color: #ffffff;
+}
 .bi-water-mark {
   color: #cccccc;
   cursor: text;
@@ -107,12 +111,8 @@
   background: #ffffff;
 }
 .bi-z-index-mask {
-  background-color: #1a1a1a;
-  opacity: 0.5;
-  filter: alpha(opacity=50);
-}
-.bi-theme-dark .bi-z-index-mask {
-  background-color: #ffffff;
+  background-color: rgba(26, 26, 26, 0.5);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f1a1a1a,endColorstr=#7f1a1a1a);
 }
 .bi-list-item:hover,
 .bi-list-item.hover {
diff --git a/src/less/core/utils/common.less b/src/less/core/utils/common.less
index 231eb96036..4f9c766a91 100644
--- a/src/less/core/utils/common.less
+++ b/src/less/core/utils/common.less
@@ -127,6 +127,11 @@
   color: @color-bi-text-highlight;
 }
 
+.bi-high-light-background {
+  background-color: @color-bi-background-highlight;
+  color: @color-bi-text;
+}
+
 //水印
 .bi-water-mark {
   color: @water-mark-color;
@@ -153,14 +158,8 @@
 }
 
 .bi-z-index-mask {
-  background-color: @color-bi-background-black;
-  .opacity(0.5);
-}
-
-.bi-theme-dark {
-  .bi-z-index-mask {
-    background-color: @color-bi-background-default;
-  }
+  background-color: rgba(26, 26, 26, .5);
+  filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f1a1a1a,endColorstr=#7f1a1a1a)";
 }
 
 //只有背景变化