diff --git a/src/assets/css/common/part-select.scss b/src/assets/css/common/part-select.scss
index d492bd53..1505d481 100644
--- a/src/assets/css/common/part-select.scss
+++ b/src/assets/css/common/part-select.scss
@@ -5,3 +5,25 @@
     display: none;
   }
 }
+.el-select-dropdown {
+  .el-scrollbar {
+    .el-select-dropdown__wrap {
+      .el-scrollbar__view.el-select-dropdown__list {
+        .el-select-dropdown__item {
+          padding: 0 8px;
+          height: 24px;
+          line-height: 24px;
+          font-size: 12px;
+          font-weight: 400;
+        }
+        .el-select-dropdown__item.selected {
+          color: #2C72C6;
+        }
+        .el-select-dropdown__item:hover {
+          color: #2C72C6;
+          background: #F7F7F7;
+        }
+      }
+    }
+  }
+}
diff --git a/src/assets/css/components/components/common/TimeRange/date-time-range.scss b/src/assets/css/components/components/common/TimeRange/date-time-range.scss
index a4251d60..f99b2bc8 100644
--- a/src/assets/css/components/components/common/TimeRange/date-time-range.scss
+++ b/src/assets/css/components/components/common/TimeRange/date-time-range.scss
@@ -91,7 +91,7 @@
     box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
     position: absolute;
     right: 0;
-    top: 34px;
+    top: 32px;
     z-index: 2;
 
     .date-range-panel-content-left {
diff --git a/src/assets/css/components/views/charts2/networkOverviewApps.scss b/src/assets/css/components/views/charts2/networkOverviewApps.scss
index cec4c14d..b2ff5e12 100644
--- a/src/assets/css/components/views/charts2/networkOverviewApps.scss
+++ b/src/assets/css/components/views/charts2/networkOverviewApps.scss
@@ -365,34 +365,3 @@
     }
   }
 }
-.app-dropdown.el-popper.is-pure {
-  .el-scrollbar {
-    .el-scrollbar__wrap {
-      .el-scrollbar__view.el-dropdown__list {
-        padding: 0;
-        margin: 0;
-        .el-dropdown-menu {
-          padding: 0;
-          .el-dropdown-menu__item {
-            padding-left: 5px;
-            max-height: 25px;
-            min-width: 80px;
-            line-height: 25px;
-            font-size: 12px;
-            font-family: Helvetica-Bold;
-            color: #353636;
-            font-weight: 400;
-            i {
-              color: #353636;
-              font-size: 12px;
-            }
-          }
-        }
-      }
-    }
-  }
-
-  .el-popper__arrow {
-    display: none;
-  }
-}
diff --git a/src/assets/css/components/views/charts2/networkOverviewLine.scss b/src/assets/css/components/views/charts2/networkOverviewLine.scss
index 89936f5f..61e45f5d 100644
--- a/src/assets/css/components/views/charts2/networkOverviewLine.scss
+++ b/src/assets/css/components/views/charts2/networkOverviewLine.scss
@@ -41,12 +41,6 @@
       .line-select-metric,.line-select-reference-line {
         display: flex;
         align-items: center;
-        span {
-          font-size: 12px;
-          color: #575757;
-          font-weight: 400;
-          margin-right: 3px;
-        }
         .line-select__operation {
           height: 24px;
           margin-left: 3px;
@@ -155,24 +149,3 @@
     }
   }
 }
-.el-select-dropdown {
-  .el-scrollbar {
-    .el-select-dropdown__wrap {
-      .el-scrollbar__view.el-select-dropdown__list {
-        .el-select-dropdown__item {
-          padding: 0 8px;
-          font-family: Helvetica-Bold;
-          height: 24px;
-          line-height: 24px;
-          font-size: 12px;
-          color: #575757;
-          font-weight: 400;
-        }
-        .el-select-dropdown__item:hover {
-          color: #2C72C6;
-          background: #fff;
-        }
-      }
-    }
-  }
-}
diff --git a/src/assets/css/components/views/charts2/networkOverviewTabs.scss b/src/assets/css/components/views/charts2/networkOverviewTabs.scss
index 6c50df2a..d437d3e5 100644
--- a/src/assets/css/components/views/charts2/networkOverviewTabs.scss
+++ b/src/assets/css/components/views/charts2/networkOverviewTabs.scss
@@ -1,6 +1,6 @@
 .tabs {
-  $blue:#046ECA;
-  $grey:#353636;
+  $blue: #2C72C6;
+  $grey: #353636;
   height:100%;
   font-size:12px;
   .tab-hide{
@@ -116,7 +116,7 @@
           width: 100px;
           height:24px;
           padding-left: 4px;
-          color:$blue;
+          color: $blue;
           font-weight:400;
         }
         .el-input__suffix {
diff --git a/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue b/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
index 58daac25..60ddead4 100644
--- a/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
+++ b/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
@@ -74,7 +74,7 @@
         <span>{{$t('network.metric')}}:</span>
         <el-select v-model="metric"
                    class="option__select select-column"
-                   popper-class="option-popper common-select"
+                   popper-class="common-select"
                    :popper-append-to-body="false"
                    key="tabMetric"
                    @change="changeMetric"