diff --git a/frontend/src/business/components/api/definition/components/request/http/ApiHttpRequestForm.vue b/frontend/src/business/components/api/definition/components/request/http/ApiHttpRequestForm.vue
index d91e138733..9794ab2617 100644
--- a/frontend/src/business/components/api/definition/components/request/http/ApiHttpRequestForm.vue
+++ b/frontend/src/business/components/api/definition/components/request/http/ApiHttpRequestForm.vue
@@ -75,13 +75,13 @@
     </el-col>
     <!--操作按钮-->
     <el-col :span="3" class="ms-left-cell">
-      <el-button class="ms-left-buttion" size="small" style="color: #B8741A;background-color: #F9F1EA" @click="addPre">+{{$t('api_test.definition.request.pre_script')}}</el-button>
+      <el-button class="ms-left-buttion" size="small" @click="addPre">+{{$t('api_test.definition.request.pre_script')}}</el-button>
       <br/>
-      <el-button class="ms-left-buttion" size="small" style="color: #783887;background-color: #F2ECF3" @click="addPost">+{{$t('api_test.definition.request.post_script')}}</el-button>
+      <el-button class="ms-left-buttion" size="small" @click="addPost">+{{$t('api_test.definition.request.post_script')}}</el-button>
       <br/>
-      <el-button class="ms-left-buttion" size="small" style="color: #A30014;background-color: #F7E6E9" @click="addAssertions">+{{$t('api_test.definition.request.assertions_rule')}}</el-button>
+      <el-button class="ms-left-buttion" size="small" @click="addAssertions">+{{$t('api_test.definition.request.assertions_rule')}}</el-button>
       <br/>
-      <el-button class="ms-left-buttion" size="small" style="color: #015478;background-color: #E6EEF2" @click="addExtract">+{{$t('api_test.definition.request.extract_param')}}</el-button>
+      <el-button class="ms-left-buttion" size="small" @click="addExtract">+{{$t('api_test.definition.request.extract_param')}}</el-button>
     </el-col>
   </el-row>
 </template>
@@ -247,4 +247,29 @@
     margin: 20px;
     min-height: 200px;
   }
+
+  .ms-left-cell .el-button:nth-of-type(1) {
+    color: #B8741A;
+    background-color: #F9F1EA;
+    border: #F9F1EA;
+  }
+
+  .ms-left-cell .el-button:nth-of-type(2) {
+    color: #783887;
+    background-color: #F2ECF3;
+    border: #F2ECF3;
+  }
+
+  .ms-left-cell .el-button:nth-of-type(3) {
+    color: #A30014;
+    background-color: #F7E6E9;
+    border: #F7E6E9;
+  }
+
+  .ms-left-cell .el-button:nth-of-type(4) {
+    color: #015478;
+    background-color: #E6EEF2;
+    border: #E6EEF2;
+  }
+
 </style>