` `` 等。透传全部 HTML 属性,如:`href/target/data-*` 等。⚠️ 禁用按钮 `
}>
+ ))}
+
+ ))}
+ >
+ );
+ }
+}
diff --git a/src/grid/_example/common.css b/src/grid/_example/common.css
new file mode 100644
index 0000000..abd5771
--- /dev/null
+++ b/src/grid/_example/common.css
@@ -0,0 +1,19 @@
+t-col-light-dom > div {
+ min-height: 40px;
+ margin-top: 8px;
+ margin-bottom: 8px;
+ background: var(--td-brand-color-6);
+ color: #fff;
+ text-align: center;
+ line-height: 40px;
+}
+
+t-col-light-dom:nth-of-type(2n) > div {
+ min-height: 40px;
+ margin-top: 8px;
+ margin-bottom: 8px;
+ color: #fff;
+ text-align: center;
+ line-height: 40px;
+ background: var(--td-brand-color-4);
+}
\ No newline at end of file
diff --git a/src/grid/_example/flex.jsx b/src/grid/_example/flex.jsx
new file mode 100644
index 0000000..1617319
--- /dev/null
+++ b/src/grid/_example/flex.jsx
@@ -0,0 +1,45 @@
+import 'tdesign-web-components/grid';
+
+import css from 'tdesign-web-components/grid/_example/common.css';
+
+export default function OrderGrid() {
+ return (
+ <>
+
+
+ 2 / 5
+
+
+ 3 / 5
+
+
+
+
+
+ 100px
+
+
+ Fill Rest
+
+
+
+
+
+ 1 1 200px
+
+
+ 0 1 300px
+
+
+
+
+
+ none
+
+
+ auto with no-wrap
+
+
+ >
+ );
+}
diff --git a/src/grid/_example/gutter.jsx b/src/grid/_example/gutter.jsx
new file mode 100644
index 0000000..22e65a5
--- /dev/null
+++ b/src/grid/_example/gutter.jsx
@@ -0,0 +1,25 @@
+import 'tdesign-web-components/grid';
+
+import css from 'tdesign-web-components/grid/_example/common.css';
+
+export default function SpaceGrid() {
+ const colRender = (num, span = 3) =>
+ Array(num)
+ .fill(3)
+ .map(() => col-3