diff --git a/lib/page/detail.js b/lib/page/detail.js
index 8438c03479792eadfd1c37d30f1075713d02f82e..c4bb11ad3fa45216bd9c99ac16a8d8ecae4308eb 100644
--- a/lib/page/detail.js
+++ b/lib/page/detail.js
@@ -13,6 +13,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const React = __importStar(require("react"));
 const antd_1 = require("antd");
 const DetailFields = __importStar(require("../field/detail"));
+const { TabPane } = antd_1.Tabs;
 class default_1 extends React.PureComponent {
     constructor() {
         super(...arguments);
@@ -24,7 +25,9 @@ class default_1 extends React.PureComponent {
     }
     render() {
         const fields = this.props.fields.filter(i => i.options.showInDetail);
-        return (React.createElement(antd_1.Descriptions, Object.assign({ className: "xc-detail", size: "middle", layout: "horizontal", title: this.props.title, bordered: true }, this.props.descriptionProps), fields.map(this._renderField)));
+        return (React.createElement(antd_1.Tabs, { className: "xc-detail", type: "card" },
+            React.createElement(TabPane, { tab: this.props.title, key: "1" },
+                React.createElement(antd_1.Descriptions, Object.assign({ size: "middle", layout: "horizontal", bordered: true }, this.props.descriptionProps), fields.map(this._renderField)))));
     }
 }
 exports.default = default_1;
diff --git a/src/page/detail.tsx b/src/page/detail.tsx
index c1ab0856b1c6591dc22fa8bd5b2f02b9a3b26a06..22631af47ae48a12e5d0d447c9e1bed44e939de1 100644
--- a/src/page/detail.tsx
+++ b/src/page/detail.tsx
@@ -3,11 +3,13 @@
  */
 
 import * as React from 'react';
-import { Descriptions } from 'antd';
+import { Tabs, Descriptions } from 'antd';
 import { DescriptionsProps } from 'antd/lib/descriptions';
 import * as Field from '../config';
 import * as DetailFields from '../field/detail';
 
+const { TabPane } = Tabs;
+
 interface Props {
     /**
      * 字段列表。
@@ -31,16 +33,18 @@ export default class extends React.PureComponent<Props> {
     render() {
         const fields = this.props.fields.filter(i => i.options.showInDetail);
         return (
-            <Descriptions
-                className="xc-detail"
-                size="middle"
-                layout="horizontal"
-                title={this.props.title}
-                bordered={true}
-                {...this.props.descriptionProps}
-            >
-                {fields.map(this._renderField)}
-            </Descriptions>
+            <Tabs className="xc-detail" type="card">
+                <TabPane tab={this.props.title} key="1">
+                    <Descriptions
+                        size="middle"
+                        layout="horizontal"
+                        bordered={true}
+                        {...this.props.descriptionProps}
+                    >
+                        {fields.map(this._renderField)}
+                    </Descriptions>
+                </TabPane>
+            </Tabs>
         );
     }