diff --git a/core/core-frontend/src/components/visualization/component-background/BackgroundOverallCommon.vue b/core/core-frontend/src/components/visualization/component-background/BackgroundOverallCommon.vue
index 0082a35c07..8cd6e670f2 100644
--- a/core/core-frontend/src/components/visualization/component-background/BackgroundOverallCommon.vue
+++ b/core/core-frontend/src/components/visualization/component-background/BackgroundOverallCommon.vue
@@ -22,7 +22,7 @@
             :class="'form-item-' + themes"
           >
             <el-segmented
-              v-model="state.commonBackground.innerPadding2.mode"
+              v-model="state.commonBackground.innerPadding.mode"
               :options="paddingModes"
               size="small"
               style="width: 100%"
@@ -31,55 +31,63 @@
             <el-row :gutter="8">
               <el-col :span="12">
                 <div style="display: flex; align-items: center; margin-bottom: 8px">
-                  <span style="width: 20%; padding-right: 8px">顶</span>
+                  <span style="width: 30%; padding-right: 8px">{{
+                    t('visualization.edge_top')
+                  }}</span>
                   <el-input-number
-                    style="width: 80%"
+                    style="width: 70%"
                     :effect="themes"
                     controls-position="right"
                     :min="0"
                     :max="100"
-                    v-model="state.commonBackground.innerPadding2.top"
+                    v-model="state.commonBackground.innerPadding.top"
                     @change="onBackgroundChange"
                   />
                 </div>
                 <div style="display: flex; align-items: center">
-                  <span style="width: 20%; padding-right: 8px">左</span>
+                  <span style="width: 30%; padding-right: 8px">{{
+                    t('visualization.edge_left')
+                  }}</span>
                   <el-input-number
-                    style="width: 80%"
+                    style="width: 70%"
                     :effect="themes"
                     controls-position="right"
                     :min="0"
                     :max="100"
-                    v-model="state.commonBackground.innerPadding2.left"
-                    :disabled="state.commonBackground.innerPadding2.mode === ShorthandMode.Uniform"
+                    v-model="state.commonBackground.innerPadding.left"
+                    :disabled="state.commonBackground.innerPadding.mode === ShorthandMode.Uniform"
                     @change="onBackgroundChange"
                   />
                 </div>
               </el-col>
               <el-col :span="12">
                 <div style="display: flex; align-items: center; margin-bottom: 8px">
-                  <span style="width: 20%; padding-right: 8px">底</span>
+                  <span style="width: 30%; padding-right: 8px">{{
+                    t('visualization.edge_bottom')
+                  }}</span>
                   <el-input-number
-                    style="width: 80%"
+                    style="width: 70%"
                     :effect="themes"
-                    :disabled="state.commonBackground.innerPadding2.mode !== ShorthandMode.PerEdge"
+                    :disabled="state.commonBackground.innerPadding.mode !== ShorthandMode.PerEdge"
                     controls-position="right"
                     :min="0"
                     :max="100"
-                    v-model="state.commonBackground.innerPadding2.bottom"
+                    v-model="state.commonBackground.innerPadding.bottom"
                     @change="onBackgroundChange"
                   />
                 </div>
                 <div style="display: flex; align-items: center">
-                  <span style="width: 20%; padding-right: 8px">右</span>
+                  <span style="width: 30%; padding-right: 8px">{{
+                    t('visualization.edge_right')
+                  }}</span>
                   <el-input-number
-                    style="width: 80%"
+                    style="width: 70%"
                     :effect="themes"
-                    :disabled="state.commonBackground.innerPadding2.mode !== ShorthandMode.PerEdge"
+                    :disabled="state.commonBackground.innerPadding.mode !== ShorthandMode.PerEdge"
                     controls-position="right"
                     :min="0"
                     :max="100"
-                    v-model="state.commonBackground.innerPadding2.right"
+                    v-model="state.commonBackground.innerPadding.right"
                     @change="onBackgroundChange"
                   />
                 </div>
@@ -340,7 +348,7 @@ import { State, ShorthandMode } from '@/components/visualization/component-backg
 
 const state = reactive<State>({
   commonBackground: {
-    innerPadding2: {}
+    innerPadding: {}
   },
   BackgroundShowMap: {},
   checked: false,
@@ -388,17 +396,17 @@ const queryBackground = () => {
 const init = () => {
   const commonBackgroundPop = deepCopy(props.commonBackgroundPop)
   const innerPadding = commonBackgroundPop.innerPadding
-  if (typeof innerPadding !== 'undefined') {
-    commonBackgroundPop.innerPadding2 = {
+  if (typeof innerPadding === 'number') {
+    commonBackgroundPop.innerPadding = {
       mode: ShorthandMode.Uniform,
       top: innerPadding,
       right: innerPadding,
       bottom: innerPadding,
       left: innerPadding
     }
-    commonBackgroundPop.innerPadding = undefined
   }
   state.commonBackground = commonBackgroundPop
+  updateInnerPadding()
   if (state.commonBackground.outerImage) {
     state.fileList = [{ url: imgUrlTrans(state.commonBackground.outerImage) }]
   } else {
@@ -429,13 +437,13 @@ const upload = file => {
 }
 
 const updateInnerPadding = () => {
-  if (state.commonBackground.innerPadding2.mode === ShorthandMode.Uniform) {
-    state.commonBackground.innerPadding2.left = state.commonBackground.innerPadding2.top
-    state.commonBackground.innerPadding2.right = state.commonBackground.innerPadding2.top
-    state.commonBackground.innerPadding2.bottom = state.commonBackground.innerPadding2.top
-  } else if (state.commonBackground.innerPadding2.mode === ShorthandMode.Axis) {
-    state.commonBackground.innerPadding2.right = state.commonBackground.innerPadding2.left
-    state.commonBackground.innerPadding2.bottom = state.commonBackground.innerPadding2.top
+  if (state.commonBackground.innerPadding.mode === ShorthandMode.Uniform) {
+    state.commonBackground.innerPadding.left = state.commonBackground.innerPadding.top
+    state.commonBackground.innerPadding.right = state.commonBackground.innerPadding.top
+    state.commonBackground.innerPadding.bottom = state.commonBackground.innerPadding.top
+  } else if (state.commonBackground.innerPadding.mode === ShorthandMode.Axis) {
+    state.commonBackground.innerPadding.right = state.commonBackground.innerPadding.left
+    state.commonBackground.innerPadding.bottom = state.commonBackground.innerPadding.top
   }
 }
 
diff --git a/core/core-frontend/src/components/visualization/component-background/Types.ts b/core/core-frontend/src/components/visualization/component-background/Types.ts
index 8d14731c52..d3869fc8c8 100644
--- a/core/core-frontend/src/components/visualization/component-background/Types.ts
+++ b/core/core-frontend/src/components/visualization/component-background/Types.ts
@@ -30,7 +30,7 @@ export interface EdgeValues {
 }
 
 export interface CommonBackground {
-  innerPadding?: number
+  innerPadding?: EdgeValues
   borderRadius?: number
   backdropFilterEnable?: boolean
   backdropFilter?: number
@@ -41,7 +41,6 @@ export interface CommonBackground {
   innerImageColor?: string
   innerImage?: string
   outerImage?: string
-  innerPadding2?: EdgeValues
 }
 
 export interface State {
diff --git a/core/core-frontend/src/custom-component/component-list.ts b/core/core-frontend/src/custom-component/component-list.ts
index 138e057e0e..f89d035caf 100644
--- a/core/core-frontend/src/custom-component/component-list.ts
+++ b/core/core-frontend/src/custom-component/component-list.ts
@@ -3,7 +3,7 @@ import { deepCopy } from '@/utils/utils'
 import { guid } from '@/views/visualized/data/dataset/form/util'
 import { getViewConfig } from '@/views/chart/components/editor/util/chart'
 import { useI18n } from '@/hooks/web/useI18n'
-import { CommonBackground } from '@/components/visualization/component-background/Types'
+import { CommonBackground, ShorthandMode } from '@/components/visualization/component-background/Types'
 const { t } = useI18n()
 
 export const commonStyle = {
@@ -185,7 +185,10 @@ export const COMMON_COMPONENT_BACKGROUND_BASE: CommonBackground = {
   backgroundType: 'innerImage',
   innerImage: 'board/board_1.svg',
   outerImage: null,
-  innerPadding: 12,
+  innerPadding: {
+    mode: ShorthandMode.Uniform,
+    top: 12
+  },
   borderRadius: 0,
   backdropFilter: 4
 }
diff --git a/core/core-frontend/src/locales/en.ts b/core/core-frontend/src/locales/en.ts
index 00a9476778..5dc8095a94 100644
--- a/core/core-frontend/src/locales/en.ts
+++ b/core/core-frontend/src/locales/en.ts
@@ -3388,6 +3388,10 @@ export default {
     inner_padding_shorthand_mode_uniform: 'Uniform',
     inner_padding_shorthand_mode_axis: 'Axis',
     inner_padding_shorthand_mode_per_edge: 'Per Edge',
+    edge_top: 'Top',
+    edge_right: 'Right',
+    edge_bottom: 'Bottom',
+    edge_left: 'Left',
     board_radio: 'Corners',
     web_set_tips: 'Some websites may not allow embedding and will not display.',
     repeat_params: 'Duplicate parameter names exist.',
diff --git a/core/core-frontend/src/locales/tw.ts b/core/core-frontend/src/locales/tw.ts
index e06c642de0..5b2f3da3e6 100644
--- a/core/core-frontend/src/locales/tw.ts
+++ b/core/core-frontend/src/locales/tw.ts
@@ -3292,6 +3292,10 @@ export default {
     inner_padding_shorthand_mode_uniform: '統一值',
     inner_padding_shorthand_mode_axis: '軸向',
     inner_padding_shorthand_mode_per_edge: '逐邊',
+    edge_top: '上',
+    edge_right: '右',
+    edge_bottom: '下',
+    edge_left: '左',
     board_radio: '圓角',
     web_set_tips: '部分網站可能設置不允許嵌入而無法顯示',
     repeat_params: '存在名稱重複的參數',
diff --git a/core/core-frontend/src/locales/zh-CN.ts b/core/core-frontend/src/locales/zh-CN.ts
index 0d23dae2ac..d702429cf5 100644
--- a/core/core-frontend/src/locales/zh-CN.ts
+++ b/core/core-frontend/src/locales/zh-CN.ts
@@ -3301,6 +3301,10 @@ export default {
     inner_padding_shorthand_mode_uniform: '统一值',
     inner_padding_shorthand_mode_axis: '轴向',
     inner_padding_shorthand_mode_per_edge: '逐边',
+    edge_top: '上',
+    edge_right: '右',
+    edge_bottom: '下',
+    edge_left: '左',
     board_radio: '圆角',
     web_set_tips: '部分网站可能设置不允许嵌入而无法显示',
     repeat_params: '存在名称重复的参数',