diff --git a/resources/assets/js/components/PreviewImage/components/view.vue b/resources/assets/js/components/PreviewImage/components/view.vue
index e384be409..21d29c8dd 100644
--- a/resources/assets/js/components/PreviewImage/components/view.vue
+++ b/resources/assets/js/components/PreviewImage/components/view.vue
@@ -72,7 +72,7 @@
             z-index: 2;
             transform: translateY(-50%);
 
-            @media (max-width: 640px) {
+            @media (width <= 640px) {
                 display: none;
             }
 
diff --git a/resources/assets/js/components/PreviewImage/index.vue b/resources/assets/js/components/PreviewImage/index.vue
index dda13abcc..bccade826 100644
--- a/resources/assets/js/components/PreviewImage/index.vue
+++ b/resources/assets/js/components/PreviewImage/index.vue
@@ -38,7 +38,7 @@ body {
                         top: 40px;
                         width: 40px;
 
-                        @media (max-width: 640px) {
+                        @media (width <= 640px) {
                             right: 24px;
                             top: 24px;
                         }
diff --git a/resources/assets/js/pages/manage/approve/index.vue b/resources/assets/js/pages/manage/approve/index.vue
index edff5552b..0403033aa 100644
--- a/resources/assets/js/pages/manage/approve/index.vue
+++ b/resources/assets/js/pages/manage/approve/index.vue
@@ -722,7 +722,7 @@ export default {
 .page-approve .ivu-tabs-nav {
     display: flex;
     width: 350px;
-    @media (max-width: 1010px) {
+    @media (width <= 1010px) {
         width: 100%;
     }
 
diff --git a/resources/assets/js/pages/manage/setting/components/SystemCheckin.vue b/resources/assets/js/pages/manage/setting/components/SystemCheckin.vue
index d7dad4c02..0b38a1105 100644
--- a/resources/assets/js/pages/manage/setting/components/SystemCheckin.vue
+++ b/resources/assets/js/pages/manage/setting/components/SystemCheckin.vue
@@ -133,7 +133,7 @@
                                 </RadioGroup>
                                 <div class="form-tip">{{$L('仅支持移动端App')}}</div>
                             </FormItem>
-                            
+
                             <!-- 百度地图配置 -->
                             <template v-if="formData.locat_map_type === 'baidu'">
                                 <FormItem :label="$L('百度地图AK')" prop="locat_bd_lbs_key">
@@ -284,7 +284,7 @@
     display: flex;
     gap: 20px;
     height: 500px;
-    @media (max-width: 768px) {
+    @media (width < 768px) {
         flex-direction: column;
         height: 700px;
         .map-radius-control {
@@ -454,7 +454,7 @@ export default {
             const mapType = this.formData.locat_map_type;
             let mapKey = '';
             let currentPoint = {};
-            
+
             // 根据地图类型获取对应的key和point
             switch (mapType) {
                 case 'baidu':
@@ -492,7 +492,7 @@ export default {
                 point: currentPoint.lng + ',' + currentPoint.lat,
                 radius: currentPoint.radius,
             })
-            
+
             this.$store.dispatch('userUrl', url).then(newUrl => {
                 this.mapSelectUrl = newUrl;
                 this.mapSelectPoint = currentPoint;
diff --git a/resources/assets/sass/components/report.scss b/resources/assets/sass/components/report.scss
index 4f8819770..39bb01d4b 100644
--- a/resources/assets/sass/components/report.scss
+++ b/resources/assets/sass/components/report.scss
@@ -68,7 +68,7 @@
         font-weight: bold;
         padding: 16px 24px;
         border-bottom: 1px solid #eeeeee;
-        @media (max-width: 500px) {
+        @media (width <= 500px) {
             padding-right: 50px;
         }
     }
@@ -86,7 +86,7 @@
             justify-content: space-between;
             row-gap: 12px;
             column-gap: 48px;
-            @media (max-width: 768px) {
+            @media (width < 768px) {
                 flex-direction: column;
                 column-gap: 0;
             }
diff --git a/resources/assets/sass/components/right-bottom.scss b/resources/assets/sass/components/right-bottom.scss
index 70d7166b5..39f9d8d1b 100644
--- a/resources/assets/sass/components/right-bottom.scss
+++ b/resources/assets/sass/components/right-bottom.scss
@@ -97,7 +97,7 @@ body.window-portrait {
     }
 }
 
-@media (max-height: 600px) {
+@media (height <= 600px) {
     .common-right-bottom {
         display: none;
     }
diff --git a/resources/assets/sass/components/search-box.scss b/resources/assets/sass/components/search-box.scss
index ea017aecb..91a73afd3 100755
--- a/resources/assets/sass/components/search-box.scss
+++ b/resources/assets/sass/components/search-box.scss
@@ -129,11 +129,11 @@
                             display: none;
                         }
 
-                        @media (max-width: 768px) {
+                        @media (width < 768px) {
                             gap: 12px;
                         }
 
-                        @media (max-width: 576px) {
+                        @media (width <= 576px) {
                             gap: 10px;
                             padding: 14px 18px 0;
                         }
@@ -197,7 +197,7 @@
                         max-height: calc(100vh - 305px);
                         overscroll-behavior: contain;
 
-                        @media (max-height: 900px) {
+                        @media (height <= 900px) {
                             max-height: calc(100vh - 175px);
                         }
 
diff --git a/resources/assets/sass/components/user-select.scss b/resources/assets/sass/components/user-select.scss
index 3c9160987..a12735dd5 100755
--- a/resources/assets/sass/components/user-select.scss
+++ b/resources/assets/sass/components/user-select.scss
@@ -238,7 +238,7 @@
                 min-height: 300px;
                 max-height: calc(100vh - 410px);
 
-                @media (max-height: 900px) {
+                @media (height <= 900px) {
                     max-height: calc(100vh - 280px);
                 }
 
diff --git a/resources/assets/sass/pages/common.scss b/resources/assets/sass/pages/common.scss
index 83ffc7b30..8567de5fe 100755
--- a/resources/assets/sass/pages/common.scss
+++ b/resources/assets/sass/pages/common.scss
@@ -288,11 +288,11 @@ body {
         .ivu-modal {
             top: 100px;
             padding-bottom: 100px;
-            @media (max-width: 768px) {
+            @media (width < 768px) {
                 top: 60px;
                 padding-bottom: 60px;
             }
-            @media (max-height: 900px) {
+            @media (height <= 900px) {
                 top: 35px;
                 padding-bottom: 35px;
             }
@@ -329,7 +329,7 @@ body {
                     min-width: 94px;
                 }
 
-                @media (max-width: 576px) {
+                @media (width <= 576px) {
                     .adaption {
                         display: flex;
                         align-items: center;
@@ -738,7 +738,7 @@ body {
         }
     }
 
-    @media (max-width: 576px) {
+    @media (width <= 576px) {
         &.lr,
         &.auto {
             > ul {
diff --git a/resources/assets/sass/pages/components/dialog-wrapper.scss b/resources/assets/sass/pages/components/dialog-wrapper.scss
index 001dba024..47ae1bf6d 100644
--- a/resources/assets/sass/pages/components/dialog-wrapper.scss
+++ b/resources/assets/sass/pages/components/dialog-wrapper.scss
@@ -2748,7 +2748,7 @@ body.window-portrait {
         }
     }
 
-    @media (max-width: 768px) and (min-width: 390px){
+    @media (390px < width < 768px) {
         .dialog-wrapper-operate {
             .operate-action {
                 width: 376px;
diff --git a/resources/assets/sass/pages/components/file-content.scss b/resources/assets/sass/pages/components/file-content.scss
index 08204d03f..6ee18a360 100644
--- a/resources/assets/sass/pages/components/file-content.scss
+++ b/resources/assets/sass/pages/components/file-content.scss
@@ -297,7 +297,7 @@
     }
 }
 
-@media (max-width: 1200px) {
+@media (width <= 1200px) {
     .file-content {
         overflow: auto;
         .edit-header,
diff --git a/resources/assets/sass/pages/components/task-add.scss b/resources/assets/sass/pages/components/task-add.scss
index 2d9cc0077..a24cccf66 100644
--- a/resources/assets/sass/pages/components/task-add.scss
+++ b/resources/assets/sass/pages/components/task-add.scss
@@ -12,13 +12,13 @@
                 overflow: hidden;
                 white-space: nowrap;
                 text-overflow: ellipsis;
-                @media (max-width: 600px) {
+                @media (width <= 600px) {
                     max-width: 200px;
                 }
-                @media (max-width: 400px) {
+                @media (width <= 400px) {
                     max-width: 160px;
                 }
-                @media (max-width: 320px) {
+                @media (width <= 320px) {
                     max-width: 100px;
                 }
             }
diff --git a/resources/assets/sass/pages/components/task-detail.scss b/resources/assets/sass/pages/components/task-detail.scss
index 99d773ac6..751e3756f 100644
--- a/resources/assets/sass/pages/components/task-detail.scss
+++ b/resources/assets/sass/pages/components/task-detail.scss
@@ -213,7 +213,7 @@
                     }
                 }
             }
-            @media (max-width: 320px) {
+            @media (width <= 320px) {
                 .nav {
                     margin-right: 20px;
                 }
diff --git a/resources/assets/sass/pages/components/task-exist-tips.scss b/resources/assets/sass/pages/components/task-exist-tips.scss
index 7d1b8edf6..fa3e09dbc 100644
--- a/resources/assets/sass/pages/components/task-exist-tips.scss
+++ b/resources/assets/sass/pages/components/task-exist-tips.scss
@@ -39,7 +39,7 @@
         opacity: 0.5;
     }
 
-    @media (max-width: 640px) {
+    @media (width <= 640px) {
         .list-task {
             margin-top: 6px;
             flex-direction: column;
diff --git a/resources/assets/sass/pages/page-apply.scss b/resources/assets/sass/pages/page-apply.scss
index e3d9173ec..717ed9b76 100644
--- a/resources/assets/sass/pages/page-apply.scss
+++ b/resources/assets/sass/pages/page-apply.scss
@@ -87,7 +87,7 @@
             }
         }
 
-        @media (max-width: 510px) {
+        @media (width <= 510px) {
             .apply-row-title {
                 margin-bottom: 8px !important;
             }
@@ -292,7 +292,7 @@
                     min-width: 120px;
                     height: 38px;
                     line-height: 36px;
-                    @media (max-width: 500px) {
+                    @media (width <= 500px) {
                         width: 50%;
                     }
                 }
@@ -452,7 +452,7 @@
                 }
             }
 
-            @media (max-width: 500px) {
+            @media (width <= 500px) {
                 padding: 0;
 
                 .ivu-modal-wrap-ul {
diff --git a/resources/assets/sass/pages/page-approve.scss b/resources/assets/sass/pages/page-approve.scss
index f21fbc489..141e6841a 100644
--- a/resources/assets/sass/pages/page-approve.scss
+++ b/resources/assets/sass/pages/page-approve.scss
@@ -64,7 +64,7 @@
                 max-width: 200px;
             }
 
-            @media (max-width: 515px) {
+            @media (width <= 515px) {
                 .ivu-btn{
                     min-width: 45px;
                 }
@@ -103,7 +103,7 @@
                 bottom: 12px;
                 max-width: 360px;
                 width: 100%;
-                @media (max-width: 1010px) {
+                @media (width <= 1010px) {
                     max-width: 100%;
                 }
 
@@ -169,7 +169,7 @@
 
                     .approve-list-active {
                         border: 1px solid #8bcf70;
-                        @media (max-width: 1010px) {
+                        @media (width <= 1010px) {
                             border: 1px solid #eeeeee;
                         }
                     }
@@ -189,7 +189,7 @@
                 flex: 1 1 auto;
                 display: flex;
                 margin: 0 0 12px 12px;
-                @media (max-width: 1010px) {
+                @media (width <= 1010px) {
                     display: none;
                 }
             }
diff --git a/resources/assets/sass/pages/page-manage.scss b/resources/assets/sass/pages/page-manage.scss
index 36d9b0b6b..aa88b5769 100644
--- a/resources/assets/sass/pages/page-manage.scss
+++ b/resources/assets/sass/pages/page-manage.scss
@@ -473,7 +473,7 @@
     }
 }
 
-@media (max-height: 640px) {
+@media (height <= 640px) {
     .page-manage {
         .manage-box-menu {
             .menu-base {
@@ -501,7 +501,7 @@ body.window-portrait {
             .mobile-tabbar {
                 display: flex;
             }
-            @media (max-height: 400px) {
+            @media (height <= 400px) {
                 .manage-box-main {
                     margin-bottom: 0;
                 }
diff --git a/resources/assets/sass/pages/page-project.scss b/resources/assets/sass/pages/page-project.scss
index d5e2c994a..2103f2b13 100644
--- a/resources/assets/sass/pages/page-project.scss
+++ b/resources/assets/sass/pages/page-project.scss
@@ -10,7 +10,7 @@
     }
 }
 
-@media (max-height: 700px) {
+@media (height <= 700px) {
     .page-project {
         .project-panel {
             height: auto;
diff --git a/resources/views/desktop.blade.php b/resources/views/desktop.blade.php
index 84e21f76c..6c3ac2d55 100755
--- a/resources/views/desktop.blade.php
+++ b/resources/views/desktop.blade.php
@@ -141,7 +141,7 @@
             color: #088acb
         }
 
-        @media (max-width: 768px) {
+        @media (width < 768px) {
             .mirror {
                 width: 100%;
                 padding: 0 15px 10px