样式修改

src/views/ModelDetail.vue

@@ -1,11 +1,10 @@
 <template>
   <div class="model-detail" :class="{ 'mobile': isMobile }">
     <!-- 顶部标题栏 -->
-    <div class="header">
+    <div :class="['header', isMobile ? 'header-move' : '']">
       <el-button
         icon="el-icon-arrow-left"
-        circle 
+        size="medium"
-        size="small"
         @click="goBack"
         class="back-btn"
       ></el-button>
@@ -193,26 +192,36 @@ export default {
 
 .header {
   height: 60px;
-  background: #409eff;
+  color: #303133;
-  color: white;
   display: flex;
   align-items: center;
   padding: 0 20px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   position: relative;
 }
+.header-move{
+  background: #409eff;
+  color: white;
+}
 
 .back-btn {
-  background: rgba(255, 255, 255, 0.2);
   border: none;
-  color: white;
+  color: #303133;
-  margin-right: 15px;
+  /* margin-right: 10px; */
+}
+.el-button:focus, .el-button:hover{
+  background-color: transparent;
+  color: #303133;
+}
+.el-button--medium{
+  font-size: 18px;
 }
 
-.back-btn:hover {
+.header-move .back-btn {
-  background: rgba(255, 255, 255, 0.3);
+  color: white;
 }
 
+
 .title {
   margin: 0;
   font-size: 18px;