diff --git a/services/dialog_ui/dialog_selector/js/pages/index/index.css b/services/dialog_ui/dialog_selector/js/pages/index/index.css
index abc01732d326752e9a6deaa7df23caf473c0d186..a0865796cadc1004b790c37e98a77063ced183d0 100644
--- a/services/dialog_ui/dialog_selector/js/pages/index/index.css
+++ b/services/dialog_ui/dialog_selector/js/pages/index/index.css
@@ -62,6 +62,7 @@
     border-radius: 8vp;
     align-self: center;
 }
+
 .AppName {
     width: 58vp;
     font-size: 12vp;
@@ -70,6 +71,7 @@
     align-self: center;
     text-overflow: ellipsis;
 }
+
 .but {
     text-align: center;
     justify-content: center;
@@ -89,40 +91,35 @@
     font-weight: regular;
 }
 
-.selector-listback {
+.selector-list {
+    margin-left: 10vp;
+    margin-right: 10vp;
+    background-color: white;
+    overflow: auto;
+    display: flex;
     flex-direction: column;
-    justify-content: flex-start;
     align-items: center;
-    background-color: #ffffff;
 }
 
-.selector-list {
-    scrollbar-width: 2vp;
-    margin-left: 10vp;
-    margin-right: 10vp;
-    background-color: #ffffff;
+.selector-listback {
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: center;
+    background-color: #00000000;
 }
 
 .selector-listItem {
     width: 90%;
     height: 68vp;
-    margin-top: 1vp;
-    margin-bottom: 1vp;
-    background-color: #ffffff;
-}
-
-.selector-listItemNode {
-    width: 100%;
-    height: 100%;
-    align-items: center;
-    border-bottom: 1vp;
+    background-color: white;
+    border-bottom: 2vp;
     border-bottom-color: #fafafa;
 }
 
 .selector-listItemAppIcon {
     height: 48vp;
     width: 48vp;
-    margin: 8vp;
+    margin: 4vp;
     border-radius: 8vp;
     align-self: center;
 }
@@ -141,15 +138,16 @@
     width: 100%;
     height: 50vp;
     justify-content: center;
-    background-color: #ffffff;
+    background-color: white;
+    border-radius: 24vp;
 }
 
 .selector-btnCancel {
-    width: 80%;
+    width: 75%;
     height: 40vp;
     font-size: 16fp;
     margin-bottom: 10vp;
     margin-top: 10vp;
     background-color: #f2f2f2;
     color: #2168f7;
-}
\ No newline at end of file
+}
diff --git a/services/dialog_ui/dialog_selector/js/pages/index/index.hml b/services/dialog_ui/dialog_selector/js/pages/index/index.hml
index 57e4d0c30e2c2700b12c6d7022d70259e33917b2..8457951d2af2fb929cd5787ae6ac587785912764 100644
--- a/services/dialog_ui/dialog_selector/js/pages/index/index.hml
+++ b/services/dialog_ui/dialog_selector/js/pages/index/index.hml
@@ -35,17 +35,15 @@
             <text class="text-cancel">{{$t('message.cancel')}}</text>
         </div>
     </div>
-    <div class="selector-listback" style="width: {{pcSelectorlist.width}}; height: {{pcSelectorlist.height}}; display: {{pcDisplay}};">
-        <list ref="selector-list" class="selector-list" scrollbar="{{pcSelectorlist.scrollbar}}">
-            <list-item class="selector-listItem" onClick="onSelector({{$item}})" for="{{selectorHapList}}">
-                <div class="selector-listItemNode">
-                    <image class="selector-listItemAppIcon" src="{{$item.icon}}"></image>
-                    <text class="selector-listItemText">{{$item.name}}</text>
-                </div>
-            </list-item>
-        </list>
+    <div class = "selector-list" style="width: {{pcSelectorlist.width}}; height: {{pcSelectorlist.height}}; display: {{pcDisplay}};">
+        <div class="selector-listback" for="{{selectorHapList}}">
+            <div class ="selector-listItem" onClick="onSelector({{$item}})">
+                <image class="selector-listItemAppIcon" src="{{$item.icon}}"></image>
+                <text class="selector-listItemText">{{$item.name}}</text>
+            </div>
+        </div>
     </div>
     <div class="selector-btnCancelback" style="display: {{pcDisplay}};">
         <input class="selector-btnCancel" type="button" value="{{ $t('message.cancel') }}" onClick="onCancel"></input>
     </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/services/dialog_ui/dialog_selector/js/pages/index/index.js b/services/dialog_ui/dialog_selector/js/pages/index/index.js
index 896526bc5cacb924d46729112742a81c6c3825a7..a73583cca44e472aaa156b164bcb24573d981e30 100644
--- a/services/dialog_ui/dialog_selector/js/pages/index/index.js
+++ b/services/dialog_ui/dialog_selector/js/pages/index/index.js
@@ -98,8 +98,7 @@ export default {
             }
         } else if (this.deviceType == "pc") {
             let heightTotalVp = 1;
-            let heightVal = 70;
-            let scrollbar = "off"
+            let heightVal = 68;
             if (this.selectorHapList.length == 2) {
                 heightTotalVp = this.selectorHapList.length * heightVal;
             } else if (this.selectorHapList.length == 3) {
@@ -107,8 +106,7 @@ export default {
             } else if (this.selectorHapList.length == 4) {
                 heightTotalVp = this.selectorHapList.length * heightVal;
             } else if (this.selectorHapList.length > 4) {
-                heightTotalVp = 4 * heightVal + 36;
-                scrollbar = "auto";
+                heightTotalVp = 4 * heightVal + 34;
             } else {
                 ;
             }
@@ -116,7 +114,6 @@ export default {
             this.pcSelectorlist = {
                 width: "100%",
                 height: heightTotalVp + "vp",
-                scrollbar:scrollbar
             };
         }
     },