diff --git a/.prettierignore b/.prettierignore
index 106c1e1cb5..cb111808f0 100644
--- a/.prettierignore
+++ b/.prettierignore
@@ -1,4 +1,4 @@
 docs/**/*
 /index.js
 /index-with-locales.js
-
+*.scss
diff --git a/docs/collapse/demo/nested.md b/docs/collapse/demo/nested.md
new file mode 100644
index 0000000000..b18957f0ff
--- /dev/null
+++ b/docs/collapse/demo/nested.md
@@ -0,0 +1,59 @@
+# 基本
+
+- order: 6
+
+:::lang=en-us
+# Nested Collapse
+
+- order: 6
+
+:::
+
+
+---
+
+````jsx
+import { Collapse } from '@alifd/next';
+
+const Panel = Collapse.Panel;
+
+ReactDOM.render(
+    <div>
+        <Collapse>
+            <Panel title="simple tile">
+                <Collapse>
+                    <Panel title="simple tile">
+                        <ul>
+                            <li>Promotions are marketing campaigns ran by Marketplace</li>
+                            <li>Participate to sale your products during that promotion and make a profit</li>
+                        </ul>
+                    </Panel>
+                    <Panel title="What are Promotion Products?">
+                        <ul>
+                            <li>Promotion Products is a service that helps you to promote products you list on Marketplace during a certain time range</li>
+                            <li>You can choose which products should be available for the promotion</li>
+                            <li>Not all Products of you will be available, because Promotions will only attract certain Product areas</li>
+                        </ul>
+                    </Panel>
+                    <Panel title="Why can i not submit a higher price?">
+                        <ul>
+                            <li>The Promotion requires a certain price to make sure that our customers are attracted</li>
+                        </ul>
+                    </Panel>
+                    <Panel title="What is Promo Stock?">
+                        Promo Stock is the criteria needed to be followed to be able to join Promotion. With setting particular Promo Stock value you commit to have this amount of stock available while Promotion is active.
+                    </Panel>
+                </Collapse>
+            </Panel>
+            <Panel title="What are Promotion Products?">
+                <ul>
+                    <li>Promotion Products is a service that helps you to promote products you list on Marketplace during a certain time range</li>
+                    <li>You can choose which products should be available for the promotion</li>
+                    <li>Not all Products of you will be available, because Promotions will only attract certain Product areas</li>
+                </ul>
+            </Panel>
+
+        </Collapse>
+    </div>,
+    mountNode);
+````
diff --git a/src/collapse/main.scss b/src/collapse/main.scss
index 2dd673b56c..8708c88e57 100644
--- a/src/collapse/main.scss
+++ b/src/collapse/main.scss
@@ -61,8 +61,10 @@
             height: auto;
             opacity: 1;
         }
+    }
 
-        #{$collapse-prefix}-panel-icon {
+    #{$collapse-prefix}-panel-icon {
+        &#{$collapse-prefix}-panel-icon-expanded {
             @include icon-size($collapse-icon-size, 0, 0, rotate($collapse-icon-rotation-expanded));
         }
     }
diff --git a/src/collapse/panel.jsx b/src/collapse/panel.jsx
index 72024806ec..8c8f18819b 100644
--- a/src/collapse/panel.jsx
+++ b/src/collapse/panel.jsx
@@ -71,6 +71,11 @@ class Panel extends React.Component {
             [className]: className,
         });
 
+        const iconCls = classNames({
+            [`${prefix}collapse-panel-icon`]: true,
+            [`${prefix}collapse-panel-icon-expanded`]: isExpanded,
+        });
+
         // 为了无障碍 需要添加两个id
         const headingId = id ? `${id}-heading` : undefined;
         const regionId = id ? `${id}-region` : undefined;
@@ -89,7 +94,7 @@ class Panel extends React.Component {
                 >
                     <Icon
                         type="arrow-up"
-                        className={`${prefix}collapse-panel-icon`}
+                        className={iconCls}
                         aria-hidden="true"
                     />
                     {title}