diff --git a/web/src/components/message-item/index.less b/web/src/components/message-item/index.less
index 6ecb903aa..a4812bd61 100644
--- a/web/src/components/message-item/index.less
+++ b/web/src/components/message-item/index.less
@@ -20,13 +20,6 @@
     & > p {
       margin: 0;
     }
-    :global(section.think) {
-      padding-left: 10px;
-      color: #8b8b8b;
-      border-left: 2px solid #d5d3d3;
-      margin-bottom: 10px;
-      font-size: 12px;
-    }
   }
   .messageText {
     .chunkText();
diff --git a/web/src/pages/chat/markdown-content/index.less b/web/src/pages/chat/markdown-content/index.less
index 66f9c6a6f..8454d6220 100644
--- a/web/src/pages/chat/markdown-content/index.less
+++ b/web/src/pages/chat/markdown-content/index.less
@@ -1,3 +1,13 @@
+.markdownContentWrapper {
+  :global(section.think) {
+    padding-left: 10px;
+    color: #8b8b8b;
+    border-left: 2px solid #d5d3d3;
+    margin-bottom: 10px;
+    font-size: 12px;
+  }
+}
+
 .referencePopoverWrapper {
   max-width: 50vw;
 }
diff --git a/web/src/pages/chat/markdown-content/index.tsx b/web/src/pages/chat/markdown-content/index.tsx
index 1069b41ad..d57190b09 100644
--- a/web/src/pages/chat/markdown-content/index.tsx
+++ b/web/src/pages/chat/markdown-content/index.tsx
@@ -52,7 +52,7 @@ const MarkdownContent = ({
     }
     const nextText = replaceTextByOldReg(text);
     return loading
-      ? nextText?.concat('~~2$$')
+      ? nextText?.concat('~~2$$') // TODO: The style of thinking also needs to be displayed when outputting
       : pipe(replaceThinkToSection, preprocessLaTeX)(nextText);
   }, [content, loading, t]);
 
@@ -186,6 +186,7 @@ const MarkdownContent = ({
     <Markdown
       rehypePlugins={[rehypeWrapReference, rehypeKatex, rehypeRaw]}
       remarkPlugins={[remarkGfm, remarkMath]}
+      className={styles.markdownContentWrapper}
       components={
         {
           'custom-typography': ({ children }: { children: string }) =>
diff --git a/web/src/utils/chat.ts b/web/src/utils/chat.ts
index b4cfd86ea..7a4f66e79 100644
--- a/web/src/utils/chat.ts
+++ b/web/src/utils/chat.ts
@@ -50,7 +50,7 @@ export const preprocessLaTeX = (content: string) => {
   return inlineProcessedContent;
 };
 
-export function replaceThinkToSection(text: string) {
+export function replaceThinkToSection(text: string = '') {
   const pattern = /<think>([\s\S]*?)<\/think>/g;
 
   const result = text.replace(pattern, '<section class="think">$1</section>');