diff --git a/src/contentLayout/__tests__/__snapshots__/contentLayout.test.tsx.snap b/src/contentLayout/__tests__/__snapshots__/contentLayout.test.tsx.snap
index b73ac6092..03f59c69f 100644
--- a/src/contentLayout/__tests__/__snapshots__/contentLayout.test.tsx.snap
+++ b/src/contentLayout/__tests__/__snapshots__/contentLayout.test.tsx.snap
@@ -6,14 +6,14 @@ exports[`test contentLayout should support contentLayout success render 1`] = `
   "baseElement": <body>
     <div>
       <div
-        class="content-layout"
+        class="dtc-content-layout"
         style="height: calc(100vh - 96px);"
       />
     </div>
   </body>,
   "container": <div>
     <div
-      class="content-layout"
+      class="dtc-content-layout"
       style="height: calc(100vh - 96px);"
     />
   </div>,
diff --git a/src/contentLayout/__tests__/contentLayout.test.tsx b/src/contentLayout/__tests__/contentLayout.test.tsx
index 5ed3db1db..486056082 100644
--- a/src/contentLayout/__tests__/contentLayout.test.tsx
+++ b/src/contentLayout/__tests__/contentLayout.test.tsx
@@ -26,7 +26,7 @@ describe('test contentLayout', () => {
                 />
             </ContentLayout>
         );
-        expect(container.querySelector<HTMLDivElement>('.content-layout')?.style.height).toBe(
+        expect(container.querySelector<HTMLDivElement>('.dtc-content-layout')?.style.height).toBe(
             'calc(100vh - 96px)'
         );
     });
@@ -47,7 +47,7 @@ describe('test contentLayout', () => {
                 />
             </ContentLayout>
         );
-        expect(container.querySelector<HTMLDivElement>('.content-layout')?.style.height).toBe(
+        expect(container.querySelector<HTMLDivElement>('.dtc-content-layout')?.style.height).toBe(
             '500px'
         );
     });
diff --git a/src/contentLayout/index.scss b/src/contentLayout/index.scss
index 5a83aea16..012e68c2e 100644
--- a/src/contentLayout/index.scss
+++ b/src/contentLayout/index.scss
@@ -1,4 +1,4 @@
-.content-layout {
+.dtc-content-layout {
     display: flex;
     flex-direction: column;
     overflow: hidden;
diff --git a/src/contentLayout/index.tsx b/src/contentLayout/index.tsx
index ad549e3a5..6053ce5b9 100644
--- a/src/contentLayout/index.tsx
+++ b/src/contentLayout/index.tsx
@@ -11,7 +11,7 @@ interface IProps {
     className?: string;
 }
 
-export const NAME = 'content-layout';
+export const NAME = 'dtc-content-layout';
 
 const ContentLayout = (props: IProps) => {
     const { height = 'calc(100vh - 96px)', style, className, children } = props;
diff --git a/src/dropdown/style.scss b/src/dropdown/style.scss
index ec7330947..52fda85e3 100644
--- a/src/dropdown/style.scss
+++ b/src/dropdown/style.scss
@@ -1,35 +1,3 @@
-// .dtc-mul-select-dropdown {
-//     .dtc-option-select-overlay {
-//         background: #FFF;
-//         box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
-//         border-radius: 2px;
-//         width: 220px;
-//         height: auto;
-//         .dtc-option-select-overlay-menu {
-//             max-height: 240px;
-//             overflow-y: scroll;
-//         }
-//         .ant-checkbox-group {
-//             width: 100%;
-//         }
-//         .ant-divider-horizontal {
-//             background: #E8E8E8;
-//             width: 204px;
-//             margin: 0 0 0 8px;
-//             min-width: 204px;
-//         }
-//         .dtc-option-select-overlay-row {
-//             padding: 8px;
-//             &.footer-box {
-//                 display: flex;
-//                 justify-content: space-between;
-//                 align-items: center;
-//                 width: 100%;
-//             }
-//         }
-//     }
-// }
-
 $gap: 8px;
 $item-size: 32px;
 
diff --git a/src/filterRules/__tests__/__snapshots__/filterRules.test.tsx.snap b/src/filterRules/__tests__/__snapshots__/filterRules.test.tsx.snap
index 6bdc22a58..45b8249e0 100644
--- a/src/filterRules/__tests__/__snapshots__/filterRules.test.tsx.snap
+++ b/src/filterRules/__tests__/__snapshots__/filterRules.test.tsx.snap
@@ -6,13 +6,13 @@ exports[`FilterRules should support FilterRules success render 1`] = `
   "baseElement": <body>
     <div>
       <div
-        class="ruleController"
+        class="dtc-ruleController"
       >
         <div
-          class="ruleController__item"
+          class="dtc-ruleController__item"
         >
           <div
-            class="ruleController__item--component"
+            class="dtc-ruleController__item--component"
           >
             <input
               class="ant-input"
@@ -21,7 +21,7 @@ exports[`FilterRules should support FilterRules success render 1`] = `
             />
           </div>
           <div
-            class="ruleController__item--operation"
+            class="dtc-ruleController__item--operation"
           >
             <span
               aria-label="plus-circle"
@@ -76,13 +76,13 @@ exports[`FilterRules should support FilterRules success render 1`] = `
   </body>,
   "container": <div>
     <div
-      class="ruleController"
+      class="dtc-ruleController"
     >
       <div
-        class="ruleController__item"
+        class="dtc-ruleController__item"
       >
         <div
-          class="ruleController__item--component"
+          class="dtc-ruleController__item--component"
         >
           <input
             class="ant-input"
@@ -91,7 +91,7 @@ exports[`FilterRules should support FilterRules success render 1`] = `
           />
         </div>
         <div
-          class="ruleController__item--operation"
+          class="dtc-ruleController__item--operation"
         >
           <span
             aria-label="plus-circle"
diff --git a/src/filterRules/ruleController/index.scss b/src/filterRules/ruleController/index.scss
index 04552274b..d9e8a0663 100644
--- a/src/filterRules/ruleController/index.scss
+++ b/src/filterRules/ruleController/index.scss
@@ -1,7 +1,7 @@
-.ruleController {
+.dtc-ruleController {
     &__condition {
         position: relative;
-        .ruleController__condition--active {
+        .dtc-ruleController__condition--active {
             padding-left: 32px;
             .condition__box--line {
                 width: 33px;
diff --git a/src/filterRules/ruleController/index.tsx b/src/filterRules/ruleController/index.tsx
index ce07cc26b..073143ddd 100644
--- a/src/filterRules/ruleController/index.tsx
+++ b/src/filterRules/ruleController/index.tsx
@@ -137,8 +137,8 @@ export const RulesController = <T,>(props: IProps<T>) => {
             return (
                 <div
                     key={item.key}
-                    className={classnames('ruleController__condition', {
-                        'ruleController__condition--active': item.children.length > 1,
+                    className={classnames('dtc-ruleController__condition', {
+                        'dtc-ruleController__condition--active': item.children.length > 1,
                     })}
                 >
                     <div
@@ -193,15 +193,15 @@ export const RulesController = <T,>(props: IProps<T>) => {
         }
         // 渲染自定义的 component
         return (
-            <div className="ruleController__item" key={item.key}>
+            <div className="dtc-ruleController__item" key={item.key}>
                 {value?.children && (
                     <span
-                        className={classnames('ruleController__item--line', {
+                        className={classnames('dtc-ruleController__item--line', {
                             disabled,
                         })}
                     />
                 )}
-                <div className="ruleController__item--component">
+                <div className="dtc-ruleController__item--component">
                     {component({
                         rowKey: item.key,
                         disabled: composeDisabled,
@@ -211,7 +211,7 @@ export const RulesController = <T,>(props: IProps<T>) => {
                     })}
                 </div>
                 {!composeDisabled && (
-                    <div className="ruleController__item--operation">
+                    <div className="dtc-ruleController__item--operation">
                         {item.level === maxLevel ? null : (
                             <PlusCircleOutlined
                                 className="icon"
@@ -233,7 +233,7 @@ export const RulesController = <T,>(props: IProps<T>) => {
     calculateTreeItemHeight(value, !!disabled);
 
     return (
-        <div className="ruleController">
+        <div className="dtc-ruleController">
             {renderCondition(value, [], !!disabled || !!value.disabled)}
         </div>
     );
diff --git a/src/modal/__tests__/__snapshots__/modal.test.tsx.snap b/src/modal/__tests__/__snapshots__/modal.test.tsx.snap
index c1df09f75..ea4a52a9a 100644
--- a/src/modal/__tests__/__snapshots__/modal.test.tsx.snap
+++ b/src/modal/__tests__/__snapshots__/modal.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`Test Modal Component Should Match snapshot 1`] = `
       <div
         aria-labelledby="test-id"
         aria-modal="true"
-        class="ant-modal dt-modal"
+        class="ant-modal dtc-modal"
         role="dialog"
         style="width: 520px;"
       >
@@ -72,7 +72,7 @@ exports[`Test Modal Component Should Match snapshot 1`] = `
             style="padding: 0px;"
           >
             <section
-              class="dt-modal-body"
+              class="dtc-modal-body"
             >
               <div>
                 test
diff --git a/src/modal/index.scss b/src/modal/index.scss
index 0df691039..837b04fdd 100644
--- a/src/modal/index.scss
+++ b/src/modal/index.scss
@@ -1,6 +1,6 @@
 $modal-max-height: 80vh;
 
-.dt-modal {
+.dtc-modal {
     .ant-modal-content {
         max-height: $modal-max-height;
         display: flex;
diff --git a/src/modal/index.tsx b/src/modal/index.tsx
index 65dd6a5a0..df9c6d1cf 100644
--- a/src/modal/index.tsx
+++ b/src/modal/index.tsx
@@ -35,7 +35,7 @@ export default function InternalModal({
 
     return (
         <Modal
-            className={classNames('dt-modal', className)}
+            className={classNames('dtc-modal', className)}
             bodyStyle={{ padding: 0, ...bodyStyle }}
             width={finalWidth}
             {...rest}
@@ -47,7 +47,7 @@ export default function InternalModal({
                     {...(isValidBanner(banner) ? {} : omit(banner, 'message'))}
                 />
             )}
-            <section className="dt-modal-body">{children}</section>
+            <section className="dtc-modal-body">{children}</section>
         </Modal>
     );
 }
