diff --git a/src/grid/GridItem.tsx b/src/grid/GridItem.tsx
index 5416c9c1..459de467 100644
--- a/src/grid/GridItem.tsx
+++ b/src/grid/GridItem.tsx
@@ -43,8 +43,8 @@ const GridItem: FC<GridItemProp> = (prop) => {
   }, [column, align]);
 
   const size = useMemo(() => {
-    if (column > 4 || !column) return 'small';
-    return column < 4 ? 'large' : 'middle';
+    if (!column || column === 4) return 'middle';
+    return column > 4 ? 'small' : 'large';
   }, [column]);
 
   const gridItemImage = useMemo(() => {
diff --git a/src/popover/Popover.tsx b/src/popover/Popover.tsx
index ff315d4c..38728d1b 100644
--- a/src/popover/Popover.tsx
+++ b/src/popover/Popover.tsx
@@ -45,8 +45,9 @@ const Popover = forwardRef<PopoverExposeRef, PopoverProps>((props, ref) => {
       classNames({
         [`${popoverClass}__content`]: true,
         [`${popoverClass}--${theme}`]: true,
+        [`${popoverClass}__content--arrow`]: showArrow,
       }),
-    [popoverClass, theme],
+    [popoverClass, theme, showArrow],
   );
 
   const getPopperPlacement = (placement: PopoverProps['placement']): Placement =>
@@ -88,14 +89,14 @@ const Popover = forwardRef<PopoverExposeRef, PopoverProps>((props, ref) => {
     if (isHorizontal) {
       const padding = isEnd ? Math.min(width + x, popperWidth) : Math.min(windowWidth - x, popperWidth);
       return {
-        [isEnd ? 'left' : 'right']: padding - 22,
+        [isEnd ? 'left' : 'right']: padding - 28,
       };
     }
 
     const isVertical = vertical.find((item) => placement.includes(item));
     if (isVertical) {
       return {
-        [isEnd ? 'top' : 'bottom']: popperHeight - 22,
+        [isEnd ? 'top' : 'bottom']: popperHeight - 28,
       };
     }
   };
diff --git a/test/snap/__snapshots__/csr.test.jsx.snap b/test/snap/__snapshots__/csr.test.jsx.snap
index 9b218dac..8dd065d9 100644
--- a/test/snap/__snapshots__/csr.test.jsx.snap
+++ b/test/snap/__snapshots__/csr.test.jsx.snap
@@ -59992,7 +59992,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60033,7 +60033,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -60047,7 +60047,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60088,7 +60088,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -60102,7 +60102,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60143,7 +60143,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -60157,7 +60157,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60198,7 +60198,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -60212,7 +60212,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60253,7 +60253,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -60267,7 +60267,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60308,7 +60308,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -60322,7 +60322,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60363,7 +60363,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -60377,7 +60377,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60418,7 +60418,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -60432,7 +60432,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60473,7 +60473,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -60487,7 +60487,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
             style="text-align: center;"
           >
             <div
-              class="t-grid-item__image t-grid-item__image--small"
+              class="t-grid-item__image t-grid-item__image--middle"
             >
               <div
                 class="t-image t-image--round"
@@ -60528,7 +60528,7 @@ exports[`csr snapshot test > csr test src/grid/_example/index.tsx 1`] = `
               class="t-grid-item__content t-grid-item__content--vertical"
             >
               <div
-                class="t-grid-item__title t-grid-item__title--small"
+                class="t-grid-item__title t-grid-item__title--middle"
               >
                 标题文字
               </div>
@@ -61158,7 +61158,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61199,7 +61199,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -61213,7 +61213,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61254,7 +61254,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -61268,7 +61268,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61309,7 +61309,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -61323,7 +61323,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61364,7 +61364,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -61378,7 +61378,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61419,7 +61419,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -61433,7 +61433,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61474,7 +61474,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -61488,7 +61488,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61529,7 +61529,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -61543,7 +61543,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61584,7 +61584,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -61598,7 +61598,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61639,7 +61639,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -61653,7 +61653,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
       style="text-align: center;"
     >
       <div
-        class="t-grid-item__image t-grid-item__image--small"
+        class="t-grid-item__image t-grid-item__image--middle"
       >
         <div
           class="t-image t-image--round"
@@ -61694,7 +61694,7 @@ exports[`csr snapshot test > csr test src/grid/_example/scroll.tsx 1`] = `
         class="t-grid-item__content t-grid-item__content--vertical"
       >
         <div
-          class="t-grid-item__title t-grid-item__title--small"
+          class="t-grid-item__title t-grid-item__title--middle"
         >
           标题文字
         </div>
@@ -81055,7 +81055,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                 style="display: none;"
               >
                 <div
-                  class="t-popover__content t-popover--dark"
+                  class="t-popover__content t-popover--dark t-popover__content--arrow"
                 >
                   弹出气泡内容
                   <div
@@ -81137,7 +81137,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                 style="display: none;"
               >
                 <div
-                  class="t-popover__content t-popover--dark"
+                  class="t-popover__content t-popover--dark t-popover__content--arrow"
                 >
                   <div
                     class="custom__list"
@@ -81215,7 +81215,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                 style="display: none;"
               >
                 <div
-                  class="t-popover__content t-popover--dark"
+                  class="t-popover__content t-popover--dark t-popover__content--arrow"
                 >
                   弹出气泡内容
                   <div
@@ -81249,7 +81249,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                 style="display: none;"
               >
                 <div
-                  class="t-popover__content t-popover--light"
+                  class="t-popover__content t-popover--light t-popover__content--arrow"
                 >
                   弹出气泡内容
                   <div
@@ -81283,7 +81283,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                 style="display: none;"
               >
                 <div
-                  class="t-popover__content t-popover--brand"
+                  class="t-popover__content t-popover--brand t-popover__content--arrow"
                 >
                   弹出气泡内容
                   <div
@@ -81321,7 +81321,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                 style="display: none;"
               >
                 <div
-                  class="t-popover__content t-popover--success"
+                  class="t-popover__content t-popover--success t-popover__content--arrow"
                 >
                   弹出气泡内容
                   <div
@@ -81355,7 +81355,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                 style="display: none;"
               >
                 <div
-                  class="t-popover__content t-popover--warning"
+                  class="t-popover__content t-popover--warning t-popover__content--arrow"
                 >
                   弹出气泡内容
                   <div
@@ -81389,7 +81389,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                 style="display: none;"
               >
                 <div
-                  class="t-popover__content t-popover--error"
+                  class="t-popover__content t-popover--error t-popover__content--arrow"
                 >
                   弹出气泡内容
                   <div
@@ -81445,7 +81445,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     弹出气泡内容
                     <div
@@ -81479,7 +81479,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     弹出气泡内容
                     <div
@@ -81513,7 +81513,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     弹出气泡内容
                     <div
@@ -81560,7 +81560,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     弹出气泡内容
                     <div
@@ -81594,7 +81594,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     弹出气泡内容
                     <div
@@ -81628,7 +81628,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     弹出气泡内容
                     <div
@@ -81675,7 +81675,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     气泡内容
                     <div
@@ -81709,7 +81709,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     气泡内容
                     <div
@@ -81743,7 +81743,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     气泡内容
                     <div
@@ -81790,7 +81790,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     气泡内容
                     <div
@@ -81824,7 +81824,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     气泡内容
                     <div
@@ -81858,7 +81858,7 @@ exports[`csr snapshot test > csr test src/popover/_example/index.tsx 1`] = `
                   style="display: none;"
                 >
                   <div
-                    class="t-popover__content t-popover--dark"
+                    class="t-popover__content t-popover--dark t-popover__content--arrow"
                   >
                     气泡内容
                     <div
@@ -81915,7 +81915,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               弹出气泡内容
               <div
@@ -81949,7 +81949,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               弹出气泡内容
               <div
@@ -81983,7 +81983,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               弹出气泡内容
               <div
@@ -82030,7 +82030,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               弹出气泡内容
               <div
@@ -82064,7 +82064,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               弹出气泡内容
               <div
@@ -82098,7 +82098,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               弹出气泡内容
               <div
@@ -82145,7 +82145,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               气泡内容
               <div
@@ -82179,7 +82179,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               气泡内容
               <div
@@ -82213,7 +82213,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               气泡内容
               <div
@@ -82260,7 +82260,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               气泡内容
               <div
@@ -82294,7 +82294,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               气泡内容
               <div
@@ -82328,7 +82328,7 @@ exports[`csr snapshot test > csr test src/popover/_example/placement.tsx 1`] = `
             style="display: none;"
           >
             <div
-              class="t-popover__content t-popover--dark"
+              class="t-popover__content t-popover--dark t-popover__content--arrow"
             >
               气泡内容
               <div
@@ -82374,7 +82374,7 @@ exports[`csr snapshot test > csr test src/popover/_example/theme.tsx 1`] = `
           style="display: none;"
         >
           <div
-            class="t-popover__content t-popover--dark"
+            class="t-popover__content t-popover--dark t-popover__content--arrow"
           >
             弹出气泡内容
             <div
@@ -82408,7 +82408,7 @@ exports[`csr snapshot test > csr test src/popover/_example/theme.tsx 1`] = `
           style="display: none;"
         >
           <div
-            class="t-popover__content t-popover--light"
+            class="t-popover__content t-popover--light t-popover__content--arrow"
           >
             弹出气泡内容
             <div
@@ -82442,7 +82442,7 @@ exports[`csr snapshot test > csr test src/popover/_example/theme.tsx 1`] = `
           style="display: none;"
         >
           <div
-            class="t-popover__content t-popover--brand"
+            class="t-popover__content t-popover--brand t-popover__content--arrow"
           >
             弹出气泡内容
             <div
@@ -82480,7 +82480,7 @@ exports[`csr snapshot test > csr test src/popover/_example/theme.tsx 1`] = `
           style="display: none;"
         >
           <div
-            class="t-popover__content t-popover--success"
+            class="t-popover__content t-popover--success t-popover__content--arrow"
           >
             弹出气泡内容
             <div
@@ -82514,7 +82514,7 @@ exports[`csr snapshot test > csr test src/popover/_example/theme.tsx 1`] = `
           style="display: none;"
         >
           <div
-            class="t-popover__content t-popover--warning"
+            class="t-popover__content t-popover--warning t-popover__content--arrow"
           >
             弹出气泡内容
             <div
@@ -82548,7 +82548,7 @@ exports[`csr snapshot test > csr test src/popover/_example/theme.tsx 1`] = `
           style="display: none;"
         >
           <div
-            class="t-popover__content t-popover--error"
+            class="t-popover__content t-popover--error t-popover__content--arrow"
           >
             弹出气泡内容
             <div
@@ -82598,7 +82598,7 @@ exports[`csr snapshot test > csr test src/popover/_example/type.tsx 1`] = `
           style="display: none;"
         >
           <div
-            class="t-popover__content t-popover--dark"
+            class="t-popover__content t-popover--dark t-popover__content--arrow"
           >
             弹出气泡内容
             <div
@@ -82680,7 +82680,7 @@ exports[`csr snapshot test > csr test src/popover/_example/type.tsx 1`] = `
           style="display: none;"
         >
           <div
-            class="t-popover__content t-popover--dark"
+            class="t-popover__content t-popover--dark t-popover__content--arrow"
           >
             <div
               class="custom__list"
@@ -132546,9 +132546,9 @@ exports[`ssr snapshot test > ssr test src/grid/_example/desc.tsx 1`] = `"<link r
 
 exports[`ssr snapshot test > ssr test src/grid/_example/icon.tsx 1`] = `"<div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-share" style="fill:none;font-size:24px"><g id="share"><g id="fill1"><path fill="transparent" d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"></path><path fill="transparent" d="M16.4907 22.0986C17.9256 22.927 19.7604 22.4354 20.5888 21.0005C21.4172 19.5656 20.9256 17.7309 19.4907 16.9024C18.0559 16.074 16.2211 16.5656 15.3927 18.0005C14.5642 19.4354 15.0559 21.2701 16.4907 22.0986Z"></path><path fill="transparent" d="M6.5005 14.5966C7.93538 13.7682 8.42701 11.9334 7.59858 10.4985C6.77015 9.06367 4.93538 8.57204 3.5005 9.40047C2.06562 10.2289 1.574 12.0637 2.40242 13.4985C3.23085 14.9334 5.06562 15.4251 6.5005 14.5966Z"></path><path fill="transparent" d="M3.5005 14.5985C4.93538 15.4269 6.77015 14.9353 7.59858 13.5004C8.42701 12.0655 7.93538 10.2308 6.5005 9.40233C5.06562 8.5739 3.23085 9.06553 2.40242 10.5004C1.574 11.9353 2.06562 13.7701 3.5005 14.5985Z"></path></g><path id="stroke1" stroke="currentColor" d="M7.59863 13.501L15.3929 18.001M7.59863 10.499L15.3929 5.99902M15.3927 5.99855C14.5642 4.56367 15.0559 2.7289 16.4907 1.90047C17.9256 1.07204 19.7604 1.56367 20.5888 2.99855C21.4172 4.43343 20.9256 6.2682 19.4907 7.09662C18.0559 7.92505 16.2211 7.43342 15.3927 5.99855ZM15.3927 18.0005C16.2211 16.5656 18.0559 16.074 19.4907 16.9024C20.9256 17.7309 21.4172 19.5656 20.5888 21.0005C19.7604 22.4354 17.9256 22.927 16.4907 22.0986C15.0559 21.2701 14.5642 19.4354 15.3927 18.0005ZM7.59858 10.4985C8.42701 11.9334 7.93538 13.7682 6.5005 14.5966C5.06562 15.4251 3.23085 14.9334 2.40242 13.4985C1.574 12.0637 2.06562 10.2289 3.5005 9.40047C4.93538 8.57204 6.77015 9.06367 7.59858 10.4985ZM7.59858 13.5004C6.77015 14.9353 4.93538 15.4269 3.5005 14.5985C2.06562 13.7701 1.574 11.9353 2.40242 10.5004C3.23085 9.06553 5.06562 8.5739 6.5005 9.40233C7.93538 10.2308 8.42701 12.0655 7.59858 13.5004Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">分享</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star" style="fill:none;font-size:24px"><g id="star"><path id="fill1" fill="transparent" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"></path><path id="stroke1" stroke="currentColor" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">收藏0</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-download" style="fill:none;font-size:24px"><g id="download"><path id="stroke1" stroke="currentColor" d="M16.5 10.5L12 15L7.5 10.5M12 13.75V4" stroke-linecap="square" stroke-width="2"></path><path id="stroke2" stroke="currentColor" d="M20.5 15V20H3.5V15" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">保存</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-edit" style="fill:none;font-size:24px"><g id="edit"><path id="fill1" fill="transparent" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336L14.1048 6.00427Z"></path><path id="fill2" fill="transparent" d="M17.9936 9.89339L21.0506 6.83635L17.1615 2.94727L14.1045 6.0043L17.9936 9.89339Z" fill-rule="evenodd" clip-rule="evenodd"></path><path id="stroke1" stroke="currentColor" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336M14.1048 6.00427L17.9939 9.89336M14.1048 6.00427L17.1615 2.94727L21.0506 6.83635L17.9939 9.89336" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">编辑</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/grid/_example/index.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Grid 宫格</h1><p class="tdesign-mobile-demo-header__summary">用于功能入口布局，将页面或特定区域切分成若干等大的区块，形成若干功能入口。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2><p class="tdesign-mobile-demo-block__summary">基础宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(5, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">最多四个字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">最多五个字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带描述宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带边框宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--bordered" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo t-grid--bordered" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带徽标宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--dot t-badge--medium t-badge--circle t-has-count"></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">8</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">13</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">NEW</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">可滑动宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--auto-size"><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">02 组件样式</h2><p class="tdesign-mobile-demo-block__summary">可传图标的宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-share" style="fill:none;font-size:24px"><g id="share"><g id="fill1"><path fill="transparent" d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"></path><path fill="transparent" d="M16.4907 22.0986C17.9256 22.927 19.7604 22.4354 20.5888 21.0005C21.4172 19.5656 20.9256 17.7309 19.4907 16.9024C18.0559 16.074 16.2211 16.5656 15.3927 18.0005C14.5642 19.4354 15.0559 21.2701 16.4907 22.0986Z"></path><path fill="transparent" d="M6.5005 14.5966C7.93538 13.7682 8.42701 11.9334 7.59858 10.4985C6.77015 9.06367 4.93538 8.57204 3.5005 9.40047C2.06562 10.2289 1.574 12.0637 2.40242 13.4985C3.23085 14.9334 5.06562 15.4251 6.5005 14.5966Z"></path><path fill="transparent" d="M3.5005 14.5985C4.93538 15.4269 6.77015 14.9353 7.59858 13.5004C8.42701 12.0655 7.93538 10.2308 6.5005 9.40233C5.06562 8.5739 3.23085 9.06553 2.40242 10.5004C1.574 11.9353 2.06562 13.7701 3.5005 14.5985Z"></path></g><path id="stroke1" stroke="currentColor" d="M7.59863 13.501L15.3929 18.001M7.59863 10.499L15.3929 5.99902M15.3927 5.99855C14.5642 4.56367 15.0559 2.7289 16.4907 1.90047C17.9256 1.07204 19.7604 1.56367 20.5888 2.99855C21.4172 4.43343 20.9256 6.2682 19.4907 7.09662C18.0559 7.92505 16.2211 7.43342 15.3927 5.99855ZM15.3927 18.0005C16.2211 16.5656 18.0559 16.074 19.4907 16.9024C20.9256 17.7309 21.4172 19.5656 20.5888 21.0005C19.7604 22.4354 17.9256 22.927 16.4907 22.0986C15.0559 21.2701 14.5642 19.4354 15.3927 18.0005ZM7.59858 10.4985C8.42701 11.9334 7.93538 13.7682 6.5005 14.5966C5.06562 15.4251 3.23085 14.9334 2.40242 13.4985C1.574 12.0637 2.06562 10.2289 3.5005 9.40047C4.93538 8.57204 6.77015 9.06367 7.59858 10.4985ZM7.59858 13.5004C6.77015 14.9353 4.93538 15.4269 3.5005 14.5985C2.06562 13.7701 1.574 11.9353 2.40242 10.5004C3.23085 9.06553 5.06562 8.5739 6.5005 9.40233C7.93538 10.2308 8.42701 12.0655 7.59858 13.5004Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">分享</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star" style="fill:none;font-size:24px"><g id="star"><path id="fill1" fill="transparent" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"></path><path id="stroke1" stroke="currentColor" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">收藏0</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-download" style="fill:none;font-size:24px"><g id="download"><path id="stroke1" stroke="currentColor" d="M16.5 10.5L12 15L7.5 10.5M12 13.75V4" stroke-linecap="square" stroke-width="2"></path><path id="stroke2" stroke="currentColor" d="M20.5 15V20H3.5V15" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">保存</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-edit" style="fill:none;font-size:24px"><g id="edit"><path id="fill1" fill="transparent" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336L14.1048 6.00427Z"></path><path id="fill2" fill="transparent" d="M17.9936 9.89339L21.0506 6.83635L17.1615 2.94727L14.1045 6.0043L17.9936 9.89339Z" fill-rule="evenodd" clip-rule="evenodd"></path><path id="stroke1" stroke="currentColor" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336M14.1048 6.00427L17.9939 9.89336M14.1048 6.00427L17.1615 2.94727L21.0506 6.83635L17.9939 9.89336" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">编辑</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">卡片宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--card" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo t-grid--card" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--horizontal" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--horizontal"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--horizontal">描述文字</div></div></div><div class="t-grid-item t-grid-item--horizontal" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--horizontal"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--horizontal">描述文字</div></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/grid/_example/index.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Grid 宫格</h1><p class="tdesign-mobile-demo-header__summary">用于功能入口布局，将页面或特定区域切分成若干等大的区块，形成若干功能入口。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2><p class="tdesign-mobile-demo-block__summary">基础宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(5, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">最多四个字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">最多五个字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带描述宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带边框宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--bordered" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo t-grid--bordered" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带徽标宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--dot t-badge--medium t-badge--circle t-has-count"></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">8</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">13</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">NEW</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">可滑动宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--auto-size"><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">02 组件样式</h2><p class="tdesign-mobile-demo-block__summary">可传图标的宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-share" style="fill:none;font-size:24px"><g id="share"><g id="fill1"><path fill="transparent" d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"></path><path fill="transparent" d="M16.4907 22.0986C17.9256 22.927 19.7604 22.4354 20.5888 21.0005C21.4172 19.5656 20.9256 17.7309 19.4907 16.9024C18.0559 16.074 16.2211 16.5656 15.3927 18.0005C14.5642 19.4354 15.0559 21.2701 16.4907 22.0986Z"></path><path fill="transparent" d="M6.5005 14.5966C7.93538 13.7682 8.42701 11.9334 7.59858 10.4985C6.77015 9.06367 4.93538 8.57204 3.5005 9.40047C2.06562 10.2289 1.574 12.0637 2.40242 13.4985C3.23085 14.9334 5.06562 15.4251 6.5005 14.5966Z"></path><path fill="transparent" d="M3.5005 14.5985C4.93538 15.4269 6.77015 14.9353 7.59858 13.5004C8.42701 12.0655 7.93538 10.2308 6.5005 9.40233C5.06562 8.5739 3.23085 9.06553 2.40242 10.5004C1.574 11.9353 2.06562 13.7701 3.5005 14.5985Z"></path></g><path id="stroke1" stroke="currentColor" d="M7.59863 13.501L15.3929 18.001M7.59863 10.499L15.3929 5.99902M15.3927 5.99855C14.5642 4.56367 15.0559 2.7289 16.4907 1.90047C17.9256 1.07204 19.7604 1.56367 20.5888 2.99855C21.4172 4.43343 20.9256 6.2682 19.4907 7.09662C18.0559 7.92505 16.2211 7.43342 15.3927 5.99855ZM15.3927 18.0005C16.2211 16.5656 18.0559 16.074 19.4907 16.9024C20.9256 17.7309 21.4172 19.5656 20.5888 21.0005C19.7604 22.4354 17.9256 22.927 16.4907 22.0986C15.0559 21.2701 14.5642 19.4354 15.3927 18.0005ZM7.59858 10.4985C8.42701 11.9334 7.93538 13.7682 6.5005 14.5966C5.06562 15.4251 3.23085 14.9334 2.40242 13.4985C1.574 12.0637 2.06562 10.2289 3.5005 9.40047C4.93538 8.57204 6.77015 9.06367 7.59858 10.4985ZM7.59858 13.5004C6.77015 14.9353 4.93538 15.4269 3.5005 14.5985C2.06562 13.7701 1.574 11.9353 2.40242 10.5004C3.23085 9.06553 5.06562 8.5739 6.5005 9.40233C7.93538 10.2308 8.42701 12.0655 7.59858 13.5004Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">分享</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star" style="fill:none;font-size:24px"><g id="star"><path id="fill1" fill="transparent" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"></path><path id="stroke1" stroke="currentColor" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">收藏0</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-download" style="fill:none;font-size:24px"><g id="download"><path id="stroke1" stroke="currentColor" d="M16.5 10.5L12 15L7.5 10.5M12 13.75V4" stroke-linecap="square" stroke-width="2"></path><path id="stroke2" stroke="currentColor" d="M20.5 15V20H3.5V15" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">保存</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-edit" style="fill:none;font-size:24px"><g id="edit"><path id="fill1" fill="transparent" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336L14.1048 6.00427Z"></path><path id="fill2" fill="transparent" d="M17.9936 9.89339L21.0506 6.83635L17.1615 2.94727L14.1045 6.0043L17.9936 9.89339Z" fill-rule="evenodd" clip-rule="evenodd"></path><path id="stroke1" stroke="currentColor" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336M14.1048 6.00427L17.9939 9.89336M14.1048 6.00427L17.1615 2.94727L21.0506 6.83635L17.9939 9.89336" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">编辑</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">卡片宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--card" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo t-grid--card" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--horizontal" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--horizontal"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--horizontal">描述文字</div></div></div><div class="t-grid-item t-grid-item--horizontal" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--horizontal"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--horizontal">描述文字</div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/grid/_example/scroll.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="t-grid grid-demo t-grid--auto-size"><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/grid/_example/scroll.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="t-grid grid-demo t-grid--auto-size"><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div>"`;
 
 exports[`ssr snapshot test > ssr test src/guide/_example/base.tsx 1`] = `"<div class="guide-demo"><button type="button" class="t-button t-button--size-medium t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->用户引导</span></button><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards;height:100vh;border-radius:0"><div><div class="guide-container base-guide"><div class="main-title"><div class="title-major">用户引导标题</div><div class="title-sub">按钮用于开启一个闭环的操作任务，如“删除”对象、“购买”商品等。</div></div><div class="field label-field"><div class="t-input t-input--layout-vertical t-input--border"><div class="t-input__wrap--prefix"><div class="t-input__label">标签文字</div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="field"><div class="t-input t-input--layout-vertical t-input--border"><div class="t-input__wrap--prefix"><div class="t-input__label">标签文字</div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="action"><button type="button" class="t-button t-button--size-large t-button--base t-button--light t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button><button type="button" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->确定</span></button></div></div></div></div></div>"`;
 
@@ -132734,13 +132734,13 @@ exports[`ssr snapshot test > ssr test src/picker/_example/index.tsx 1`] = `"<div
 
 exports[`ssr snapshot test > ssr test src/picker/_example/with-title.tsx 1`] = `"<div class="t-cell"><div class="t-cell__left"></div><div class="t-cell__title"><div class="t-cell__title-text">带标题选择器</div></div><div class="t-cell__right t-cell__right--middle"><div class="t-cell__right-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-cell"><div class="t-cell__left"></div><div class="t-cell__title"><div class="t-cell__title-text">无标题选择器</div></div><div class="t-cell__right t-cell__right--middle"><div class="t-cell__right-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-picker"><div class="t-picker__toolbar"><div class="t-picker__cancel">取消</div><div class="t-picker__title"></div><div class="t-picker__confirm">确认</div></div><div class="t-picker__main"><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">北京市</li><li class="t-picker-item__item">上海市</li><li class="t-picker-item__item">广州市</li><li class="t-picker-item__item">深圳市</li></ul></div><div class="t-picker__mask t-picker__mask--top"></div><div class="t-picker__mask t-picker__mask--bottom"></div><div class="t-picker__indicator"></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/popover/_example/index.tsx 1`] = `"<div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Popover 弹出气泡</h1><p class="tdesign-mobile-demo-header__summary">用于文字提示的气泡框。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2></div><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">不带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->不带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容</div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">自定义内容弹出气泡</div><div class="custom popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->自定义内容</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark"><div class="custom__list"><div class="custom__item">选项<!-- -->1</div><div class="custom__item">选项<!-- -->2</div><div class="custom__item">选项<!-- -->3</div></div><div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">02 组件样式</h2></div><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->深色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->浅色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--light">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->品牌色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--brand">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->成功色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--success">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->警告色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--warning">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->错误色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--error">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">顶部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部左</span></button></div><div data-popper-placement="top-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部中</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部右</span></button></div><div data-popper-placement="top-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">底部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部左</span></button></div><div data-popper-placement="bottom-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部中</span></button></div><div data-popper-placement="bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部右</span></button></div><div data-popper-placement="bottom-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">右侧弹出气泡</div><div class="popover-placement-example__content column mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧上</span></button></div><div data-popper-placement="right-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧中</span></button></div><div data-popper-placement="right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧下</span></button></div><div data-popper-placement="right-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">左侧弹出气泡</div><div class="popover-placement-example__content column flex-end mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧上</span></button></div><div data-popper-placement="left-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧中</span></button></div><div data-popper-placement="left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧下</span></button></div><div data-popper-placement="left-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/popover/_example/index.tsx 1`] = `"<div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Popover 弹出气泡</h1><p class="tdesign-mobile-demo-header__summary">用于文字提示的气泡框。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2></div><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">不带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->不带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容</div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">自定义内容弹出气泡</div><div class="custom popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->自定义内容</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow"><div class="custom__list"><div class="custom__item">选项<!-- -->1</div><div class="custom__item">选项<!-- -->2</div><div class="custom__item">选项<!-- -->3</div></div><div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">02 组件样式</h2></div><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->深色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->浅色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--light t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->品牌色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--brand t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->成功色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--success t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->警告色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--warning t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->错误色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--error t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">顶部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部左</span></button></div><div data-popper-placement="top-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部中</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部右</span></button></div><div data-popper-placement="top-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">底部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部左</span></button></div><div data-popper-placement="bottom-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部中</span></button></div><div data-popper-placement="bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部右</span></button></div><div data-popper-placement="bottom-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">右侧弹出气泡</div><div class="popover-placement-example__content column mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧上</span></button></div><div data-popper-placement="right-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧中</span></button></div><div data-popper-placement="right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧下</span></button></div><div data-popper-placement="right-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">左侧弹出气泡</div><div class="popover-placement-example__content column flex-end mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧上</span></button></div><div data-popper-placement="left-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧中</span></button></div><div data-popper-placement="left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧下</span></button></div><div data-popper-placement="left-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/popover/_example/placement.tsx 1`] = `"<div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">顶部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部左</span></button></div><div data-popper-placement="top-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部中</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部右</span></button></div><div data-popper-placement="top-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">底部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部左</span></button></div><div data-popper-placement="bottom-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部中</span></button></div><div data-popper-placement="bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部右</span></button></div><div data-popper-placement="bottom-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">右侧弹出气泡</div><div class="popover-placement-example__content column mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧上</span></button></div><div data-popper-placement="right-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧中</span></button></div><div data-popper-placement="right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧下</span></button></div><div data-popper-placement="right-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">左侧弹出气泡</div><div class="popover-placement-example__content column flex-end mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧上</span></button></div><div data-popper-placement="left-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧中</span></button></div><div data-popper-placement="left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧下</span></button></div><div data-popper-placement="left-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/popover/_example/placement.tsx 1`] = `"<div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">顶部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部左</span></button></div><div data-popper-placement="top-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部中</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部右</span></button></div><div data-popper-placement="top-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">底部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部左</span></button></div><div data-popper-placement="bottom-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部中</span></button></div><div data-popper-placement="bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部右</span></button></div><div data-popper-placement="bottom-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">右侧弹出气泡</div><div class="popover-placement-example__content column mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧上</span></button></div><div data-popper-placement="right-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧中</span></button></div><div data-popper-placement="right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧下</span></button></div><div data-popper-placement="right-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">左侧弹出气泡</div><div class="popover-placement-example__content column flex-end mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧上</span></button></div><div data-popper-placement="left-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧中</span></button></div><div data-popper-placement="left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧下</span></button></div><div data-popper-placement="left-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/popover/_example/theme.tsx 1`] = `"<div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->深色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->浅色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--light">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->品牌色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--brand">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->成功色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--success">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->警告色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--warning">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->错误色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--error">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/popover/_example/theme.tsx 1`] = `"<div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->深色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->浅色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--light t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->品牌色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--brand t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->成功色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--success t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->警告色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--warning t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->错误色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--error t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/popover/_example/type.tsx 1`] = `"<div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">不带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->不带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容</div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">自定义内容弹出气泡</div><div class="custom popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->自定义内容</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark"><div class="custom__list"><div class="custom__item">选项<!-- -->1</div><div class="custom__item">选项<!-- -->2</div><div class="custom__item">选项<!-- -->3</div></div><div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/popover/_example/type.tsx 1`] = `"<div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">不带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->不带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容</div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">自定义内容弹出气泡</div><div class="custom popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->自定义内容</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow"><div class="custom__list"><div class="custom__item">选项<!-- -->1</div><div class="custom__item">选项<!-- -->2</div><div class="custom__item">选项<!-- -->3</div></div><div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div>"`;
 
 exports[`ssr snapshot test > ssr test src/popup/_example/base.tsx 1`] = `"<div style="padding:0 16px"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->顶部弹出</span></button><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->左侧弹出</span></button><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->中间弹出</span></button><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->底部弹出</span></button><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->右侧弹出</span></button><div class="t-popup t-popup--top" style="display:none;animation-fill-mode:forwards;padding:100px"></div></div>"`;
 
diff --git a/test/snap/__snapshots__/ssr.test.jsx.snap b/test/snap/__snapshots__/ssr.test.jsx.snap
index 5f7a3ee8..8cc35003 100644
--- a/test/snap/__snapshots__/ssr.test.jsx.snap
+++ b/test/snap/__snapshots__/ssr.test.jsx.snap
@@ -266,9 +266,9 @@ exports[`ssr snapshot test > ssr test src/grid/_example/desc.tsx 1`] = `"<link r
 
 exports[`ssr snapshot test > ssr test src/grid/_example/icon.tsx 1`] = `"<div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-share" style="fill:none;font-size:24px"><g id="share"><g id="fill1"><path fill="transparent" d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"></path><path fill="transparent" d="M16.4907 22.0986C17.9256 22.927 19.7604 22.4354 20.5888 21.0005C21.4172 19.5656 20.9256 17.7309 19.4907 16.9024C18.0559 16.074 16.2211 16.5656 15.3927 18.0005C14.5642 19.4354 15.0559 21.2701 16.4907 22.0986Z"></path><path fill="transparent" d="M6.5005 14.5966C7.93538 13.7682 8.42701 11.9334 7.59858 10.4985C6.77015 9.06367 4.93538 8.57204 3.5005 9.40047C2.06562 10.2289 1.574 12.0637 2.40242 13.4985C3.23085 14.9334 5.06562 15.4251 6.5005 14.5966Z"></path><path fill="transparent" d="M3.5005 14.5985C4.93538 15.4269 6.77015 14.9353 7.59858 13.5004C8.42701 12.0655 7.93538 10.2308 6.5005 9.40233C5.06562 8.5739 3.23085 9.06553 2.40242 10.5004C1.574 11.9353 2.06562 13.7701 3.5005 14.5985Z"></path></g><path id="stroke1" stroke="currentColor" d="M7.59863 13.501L15.3929 18.001M7.59863 10.499L15.3929 5.99902M15.3927 5.99855C14.5642 4.56367 15.0559 2.7289 16.4907 1.90047C17.9256 1.07204 19.7604 1.56367 20.5888 2.99855C21.4172 4.43343 20.9256 6.2682 19.4907 7.09662C18.0559 7.92505 16.2211 7.43342 15.3927 5.99855ZM15.3927 18.0005C16.2211 16.5656 18.0559 16.074 19.4907 16.9024C20.9256 17.7309 21.4172 19.5656 20.5888 21.0005C19.7604 22.4354 17.9256 22.927 16.4907 22.0986C15.0559 21.2701 14.5642 19.4354 15.3927 18.0005ZM7.59858 10.4985C8.42701 11.9334 7.93538 13.7682 6.5005 14.5966C5.06562 15.4251 3.23085 14.9334 2.40242 13.4985C1.574 12.0637 2.06562 10.2289 3.5005 9.40047C4.93538 8.57204 6.77015 9.06367 7.59858 10.4985ZM7.59858 13.5004C6.77015 14.9353 4.93538 15.4269 3.5005 14.5985C2.06562 13.7701 1.574 11.9353 2.40242 10.5004C3.23085 9.06553 5.06562 8.5739 6.5005 9.40233C7.93538 10.2308 8.42701 12.0655 7.59858 13.5004Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">分享</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star" style="fill:none;font-size:24px"><g id="star"><path id="fill1" fill="transparent" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"></path><path id="stroke1" stroke="currentColor" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">收藏0</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-download" style="fill:none;font-size:24px"><g id="download"><path id="stroke1" stroke="currentColor" d="M16.5 10.5L12 15L7.5 10.5M12 13.75V4" stroke-linecap="square" stroke-width="2"></path><path id="stroke2" stroke="currentColor" d="M20.5 15V20H3.5V15" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">保存</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-edit" style="fill:none;font-size:24px"><g id="edit"><path id="fill1" fill="transparent" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336L14.1048 6.00427Z"></path><path id="fill2" fill="transparent" d="M17.9936 9.89339L21.0506 6.83635L17.1615 2.94727L14.1045 6.0043L17.9936 9.89339Z" fill-rule="evenodd" clip-rule="evenodd"></path><path id="stroke1" stroke="currentColor" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336M14.1048 6.00427L17.9939 9.89336M14.1048 6.00427L17.1615 2.94727L21.0506 6.83635L17.9939 9.89336" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">编辑</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/grid/_example/index.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Grid 宫格</h1><p class="tdesign-mobile-demo-header__summary">用于功能入口布局，将页面或特定区域切分成若干等大的区块，形成若干功能入口。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2><p class="tdesign-mobile-demo-block__summary">基础宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(5, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">最多四个字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">最多五个字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带描述宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带边框宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--bordered" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo t-grid--bordered" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带徽标宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--dot t-badge--medium t-badge--circle t-has-count"></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">8</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">13</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">NEW</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">可滑动宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--auto-size"><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">02 组件样式</h2><p class="tdesign-mobile-demo-block__summary">可传图标的宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-share" style="fill:none;font-size:24px"><g id="share"><g id="fill1"><path fill="transparent" d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"></path><path fill="transparent" d="M16.4907 22.0986C17.9256 22.927 19.7604 22.4354 20.5888 21.0005C21.4172 19.5656 20.9256 17.7309 19.4907 16.9024C18.0559 16.074 16.2211 16.5656 15.3927 18.0005C14.5642 19.4354 15.0559 21.2701 16.4907 22.0986Z"></path><path fill="transparent" d="M6.5005 14.5966C7.93538 13.7682 8.42701 11.9334 7.59858 10.4985C6.77015 9.06367 4.93538 8.57204 3.5005 9.40047C2.06562 10.2289 1.574 12.0637 2.40242 13.4985C3.23085 14.9334 5.06562 15.4251 6.5005 14.5966Z"></path><path fill="transparent" d="M3.5005 14.5985C4.93538 15.4269 6.77015 14.9353 7.59858 13.5004C8.42701 12.0655 7.93538 10.2308 6.5005 9.40233C5.06562 8.5739 3.23085 9.06553 2.40242 10.5004C1.574 11.9353 2.06562 13.7701 3.5005 14.5985Z"></path></g><path id="stroke1" stroke="currentColor" d="M7.59863 13.501L15.3929 18.001M7.59863 10.499L15.3929 5.99902M15.3927 5.99855C14.5642 4.56367 15.0559 2.7289 16.4907 1.90047C17.9256 1.07204 19.7604 1.56367 20.5888 2.99855C21.4172 4.43343 20.9256 6.2682 19.4907 7.09662C18.0559 7.92505 16.2211 7.43342 15.3927 5.99855ZM15.3927 18.0005C16.2211 16.5656 18.0559 16.074 19.4907 16.9024C20.9256 17.7309 21.4172 19.5656 20.5888 21.0005C19.7604 22.4354 17.9256 22.927 16.4907 22.0986C15.0559 21.2701 14.5642 19.4354 15.3927 18.0005ZM7.59858 10.4985C8.42701 11.9334 7.93538 13.7682 6.5005 14.5966C5.06562 15.4251 3.23085 14.9334 2.40242 13.4985C1.574 12.0637 2.06562 10.2289 3.5005 9.40047C4.93538 8.57204 6.77015 9.06367 7.59858 10.4985ZM7.59858 13.5004C6.77015 14.9353 4.93538 15.4269 3.5005 14.5985C2.06562 13.7701 1.574 11.9353 2.40242 10.5004C3.23085 9.06553 5.06562 8.5739 6.5005 9.40233C7.93538 10.2308 8.42701 12.0655 7.59858 13.5004Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">分享</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star" style="fill:none;font-size:24px"><g id="star"><path id="fill1" fill="transparent" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"></path><path id="stroke1" stroke="currentColor" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">收藏0</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-download" style="fill:none;font-size:24px"><g id="download"><path id="stroke1" stroke="currentColor" d="M16.5 10.5L12 15L7.5 10.5M12 13.75V4" stroke-linecap="square" stroke-width="2"></path><path id="stroke2" stroke="currentColor" d="M20.5 15V20H3.5V15" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">保存</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-edit" style="fill:none;font-size:24px"><g id="edit"><path id="fill1" fill="transparent" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336L14.1048 6.00427Z"></path><path id="fill2" fill="transparent" d="M17.9936 9.89339L21.0506 6.83635L17.1615 2.94727L14.1045 6.0043L17.9936 9.89339Z" fill-rule="evenodd" clip-rule="evenodd"></path><path id="stroke1" stroke="currentColor" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336M14.1048 6.00427L17.9939 9.89336M14.1048 6.00427L17.1615 2.94727L21.0506 6.83635L17.9939 9.89336" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">编辑</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">卡片宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--card" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo t-grid--card" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--horizontal" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--horizontal"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--horizontal">描述文字</div></div></div><div class="t-grid-item t-grid-item--horizontal" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--horizontal"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--horizontal">描述文字</div></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/grid/_example/index.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Grid 宫格</h1><p class="tdesign-mobile-demo-header__summary">用于功能入口布局，将页面或特定区域切分成若干等大的区块，形成若干功能入口。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2><p class="tdesign-mobile-demo-block__summary">基础宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(5, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:20%"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">最多四个字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">最多五个字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带描述宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带边框宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--bordered" style="padding:undefinedpx;grid-template-columns:repeat(3, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:33.333333333333336%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo t-grid--bordered" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical t-grid-item--bordered" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">带徽标宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--dot t-badge--medium t-badge--circle t-has-count"></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">8</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">13</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count">NEW</div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">可滑动宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--auto-size"><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">02 组件样式</h2><p class="tdesign-mobile-demo-block__summary">可传图标的宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-share" style="fill:none;font-size:24px"><g id="share"><g id="fill1"><path fill="transparent" d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"></path><path fill="transparent" d="M16.4907 22.0986C17.9256 22.927 19.7604 22.4354 20.5888 21.0005C21.4172 19.5656 20.9256 17.7309 19.4907 16.9024C18.0559 16.074 16.2211 16.5656 15.3927 18.0005C14.5642 19.4354 15.0559 21.2701 16.4907 22.0986Z"></path><path fill="transparent" d="M6.5005 14.5966C7.93538 13.7682 8.42701 11.9334 7.59858 10.4985C6.77015 9.06367 4.93538 8.57204 3.5005 9.40047C2.06562 10.2289 1.574 12.0637 2.40242 13.4985C3.23085 14.9334 5.06562 15.4251 6.5005 14.5966Z"></path><path fill="transparent" d="M3.5005 14.5985C4.93538 15.4269 6.77015 14.9353 7.59858 13.5004C8.42701 12.0655 7.93538 10.2308 6.5005 9.40233C5.06562 8.5739 3.23085 9.06553 2.40242 10.5004C1.574 11.9353 2.06562 13.7701 3.5005 14.5985Z"></path></g><path id="stroke1" stroke="currentColor" d="M7.59863 13.501L15.3929 18.001M7.59863 10.499L15.3929 5.99902M15.3927 5.99855C14.5642 4.56367 15.0559 2.7289 16.4907 1.90047C17.9256 1.07204 19.7604 1.56367 20.5888 2.99855C21.4172 4.43343 20.9256 6.2682 19.4907 7.09662C18.0559 7.92505 16.2211 7.43342 15.3927 5.99855ZM15.3927 18.0005C16.2211 16.5656 18.0559 16.074 19.4907 16.9024C20.9256 17.7309 21.4172 19.5656 20.5888 21.0005C19.7604 22.4354 17.9256 22.927 16.4907 22.0986C15.0559 21.2701 14.5642 19.4354 15.3927 18.0005ZM7.59858 10.4985C8.42701 11.9334 7.93538 13.7682 6.5005 14.5966C5.06562 15.4251 3.23085 14.9334 2.40242 13.4985C1.574 12.0637 2.06562 10.2289 3.5005 9.40047C4.93538 8.57204 6.77015 9.06367 7.59858 10.4985ZM7.59858 13.5004C6.77015 14.9353 4.93538 15.4269 3.5005 14.5985C2.06562 13.7701 1.574 11.9353 2.40242 10.5004C3.23085 9.06553 5.06562 8.5739 6.5005 9.40233C7.93538 10.2308 8.42701 12.0655 7.59858 13.5004Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">分享</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star" style="fill:none;font-size:24px"><g id="star"><path id="fill1" fill="transparent" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"></path><path id="stroke1" stroke="currentColor" d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">收藏0</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-download" style="fill:none;font-size:24px"><g id="download"><path id="stroke1" stroke="currentColor" d="M16.5 10.5L12 15L7.5 10.5M12 13.75V4" stroke-linecap="square" stroke-width="2"></path><path id="stroke2" stroke="currentColor" d="M20.5 15V20H3.5V15" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">保存</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-edit" style="fill:none;font-size:24px"><g id="edit"><path id="fill1" fill="transparent" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336L14.1048 6.00427Z"></path><path id="fill2" fill="transparent" d="M17.9936 9.89339L21.0506 6.83635L17.1615 2.94727L14.1045 6.0043L17.9936 9.89339Z" fill-rule="evenodd" clip-rule="evenodd"></path><path id="stroke1" stroke="currentColor" d="M14.1048 6.00427L4.78744 15.3216L3.99805 20.0001L8.67652 19.2107L17.9939 9.89336M14.1048 6.00427L17.9939 9.89336M14.1048 6.00427L17.1615 2.94727L21.0506 6.83635L17.9939 9.89336" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">编辑</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">卡片宫格</p></div><div class="tdesign-mobile-demo-block__slot"><div class="t-grid grid-demo t-grid--card" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述文字</div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">最多六个文字</div><div class="t-grid-item__description t-grid-item__description--vertical">描述最多六字</div></div></div></div><div class="t-grid grid-demo t-grid--card" style="padding:undefinedpx;grid-template-columns:repeat(2, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--horizontal" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--horizontal"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--horizontal">描述文字</div></div></div><div class="t-grid-item t-grid-item--horizontal" style="text-align:center;flex-basis:50%"><div class="t-grid-item__image t-grid-item__image--large"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--horizontal"><div class="t-grid-item__title t-grid-item__title--large">标题文字</div><div class="t-grid-item__description t-grid-item__description--horizontal">描述文字</div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/grid/_example/scroll.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="t-grid grid-demo t-grid--auto-size"><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--small"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--small">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/grid/_example/scroll.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="t-grid grid-demo t-grid--auto-size"><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div>"`;
 
 exports[`ssr snapshot test > ssr test src/guide/_example/base.tsx 1`] = `"<div class="guide-demo"><button type="button" class="t-button t-button--size-medium t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->用户引导</span></button><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards;height:100vh;border-radius:0"><div><div class="guide-container base-guide"><div class="main-title"><div class="title-major">用户引导标题</div><div class="title-sub">按钮用于开启一个闭环的操作任务，如“删除”对象、“购买”商品等。</div></div><div class="field label-field"><div class="t-input t-input--layout-vertical t-input--border"><div class="t-input__wrap--prefix"><div class="t-input__label">标签文字</div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="field"><div class="t-input t-input--layout-vertical t-input--border"><div class="t-input__wrap--prefix"><div class="t-input__label">标签文字</div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="action"><button type="button" class="t-button t-button--size-large t-button--base t-button--light t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button><button type="button" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->确定</span></button></div></div></div></div></div>"`;
 
@@ -454,13 +454,13 @@ exports[`ssr snapshot test > ssr test src/picker/_example/index.tsx 1`] = `"<div
 
 exports[`ssr snapshot test > ssr test src/picker/_example/with-title.tsx 1`] = `"<div class="t-cell"><div class="t-cell__left"></div><div class="t-cell__title"><div class="t-cell__title-text">带标题选择器</div></div><div class="t-cell__right t-cell__right--middle"><div class="t-cell__right-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-cell"><div class="t-cell__left"></div><div class="t-cell__title"><div class="t-cell__title-text">无标题选择器</div></div><div class="t-cell__right t-cell__right--middle"><div class="t-cell__right-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-picker"><div class="t-picker__toolbar"><div class="t-picker__cancel">取消</div><div class="t-picker__title"></div><div class="t-picker__confirm">确认</div></div><div class="t-picker__main"><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">北京市</li><li class="t-picker-item__item">上海市</li><li class="t-picker-item__item">广州市</li><li class="t-picker-item__item">深圳市</li></ul></div><div class="t-picker__mask t-picker__mask--top"></div><div class="t-picker__mask t-picker__mask--bottom"></div><div class="t-picker__indicator"></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/popover/_example/index.tsx 1`] = `"<div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Popover 弹出气泡</h1><p class="tdesign-mobile-demo-header__summary">用于文字提示的气泡框。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2></div><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">不带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->不带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容</div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">自定义内容弹出气泡</div><div class="custom popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->自定义内容</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark"><div class="custom__list"><div class="custom__item">选项<!-- -->1</div><div class="custom__item">选项<!-- -->2</div><div class="custom__item">选项<!-- -->3</div></div><div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">02 组件样式</h2></div><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->深色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->浅色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--light">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->品牌色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--brand">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->成功色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--success">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->警告色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--warning">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->错误色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--error">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">顶部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部左</span></button></div><div data-popper-placement="top-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部中</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部右</span></button></div><div data-popper-placement="top-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">底部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部左</span></button></div><div data-popper-placement="bottom-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部中</span></button></div><div data-popper-placement="bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部右</span></button></div><div data-popper-placement="bottom-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">右侧弹出气泡</div><div class="popover-placement-example__content column mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧上</span></button></div><div data-popper-placement="right-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧中</span></button></div><div data-popper-placement="right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧下</span></button></div><div data-popper-placement="right-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">左侧弹出气泡</div><div class="popover-placement-example__content column flex-end mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧上</span></button></div><div data-popper-placement="left-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧中</span></button></div><div data-popper-placement="left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧下</span></button></div><div data-popper-placement="left-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/popover/_example/index.tsx 1`] = `"<div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Popover 弹出气泡</h1><p class="tdesign-mobile-demo-header__summary">用于文字提示的气泡框。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2></div><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">不带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->不带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容</div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">自定义内容弹出气泡</div><div class="custom popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->自定义内容</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow"><div class="custom__list"><div class="custom__item">选项<!-- -->1</div><div class="custom__item">选项<!-- -->2</div><div class="custom__item">选项<!-- -->3</div></div><div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">02 组件样式</h2></div><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->深色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->浅色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--light t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->品牌色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--brand t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->成功色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--success t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->警告色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--warning t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->错误色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--error t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__slot"><div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">顶部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部左</span></button></div><div data-popper-placement="top-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部中</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部右</span></button></div><div data-popper-placement="top-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">底部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部左</span></button></div><div data-popper-placement="bottom-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部中</span></button></div><div data-popper-placement="bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部右</span></button></div><div data-popper-placement="bottom-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">右侧弹出气泡</div><div class="popover-placement-example__content column mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧上</span></button></div><div data-popper-placement="right-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧中</span></button></div><div data-popper-placement="right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧下</span></button></div><div data-popper-placement="right-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">左侧弹出气泡</div><div class="popover-placement-example__content column flex-end mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧上</span></button></div><div data-popper-placement="left-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧中</span></button></div><div data-popper-placement="left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧下</span></button></div><div data-popper-placement="left-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/popover/_example/placement.tsx 1`] = `"<div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">顶部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部左</span></button></div><div data-popper-placement="top-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部中</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部右</span></button></div><div data-popper-placement="top-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">底部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部左</span></button></div><div data-popper-placement="bottom-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部中</span></button></div><div data-popper-placement="bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部右</span></button></div><div data-popper-placement="bottom-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">右侧弹出气泡</div><div class="popover-placement-example__content column mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧上</span></button></div><div data-popper-placement="right-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧中</span></button></div><div data-popper-placement="right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧下</span></button></div><div data-popper-placement="right-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">左侧弹出气泡</div><div class="popover-placement-example__content column flex-end mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧上</span></button></div><div data-popper-placement="left-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧中</span></button></div><div data-popper-placement="left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧下</span></button></div><div data-popper-placement="left-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/popover/_example/placement.tsx 1`] = `"<div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">顶部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部左</span></button></div><div data-popper-placement="top-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部中</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->顶部右</span></button></div><div data-popper-placement="top-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">底部弹出气泡</div><div class="popover-placement-example__content row mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部左</span></button></div><div data-popper-placement="bottom-left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部中</span></button></div><div data-popper-placement="bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->底部右</span></button></div><div data-popper-placement="bottom-right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">右侧弹出气泡</div><div class="popover-placement-example__content column mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧上</span></button></div><div data-popper-placement="right-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧中</span></button></div><div data-popper-placement="right" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->右侧下</span></button></div><div data-popper-placement="right-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div><div class="popover-placement-example"><div class="popover-placement-example__summary mb-16">左侧弹出气泡</div><div class="popover-placement-example__content column flex-end mb-24"><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧上</span></button></div><div data-popper-placement="left-top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧中</span></button></div><div data-popper-placement="left" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-placement-example__content__item"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-with--large"><span class="t-button__content"> <!-- -->左侧下</span></button></div><div data-popper-placement="left-bottom" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/popover/_example/theme.tsx 1`] = `"<div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->深色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->浅色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--light">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->品牌色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--brand">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->成功色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--success">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->警告色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--warning">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->错误色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--error">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/popover/_example/theme.tsx 1`] = `"<div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->深色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->浅色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--light t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->品牌色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--brand t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-theme-example"><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->成功色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--success t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->警告色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--warning t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div><div class="popover-theme-example__content"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle button-width--small"><span class="t-button__content"> <!-- -->错误色</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--error t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/popover/_example/type.tsx 1`] = `"<div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">不带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->不带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容</div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">自定义内容弹出气泡</div><div class="custom popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->自定义内容</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark"><div class="custom__list"><div class="custom__item">选项<!-- -->1</div><div class="custom__item">选项<!-- -->2</div><div class="custom__item">选项<!-- -->3</div></div><div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/popover/_example/type.tsx 1`] = `"<div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow">弹出气泡内容<div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">不带箭头的弹出气泡</div><div class="popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->不带箭头</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark">弹出气泡内容</div></div></div></div><div class="popover-type-example"><div class="popover-type-example__summary mb-16">自定义内容弹出气泡</div><div class="custom popover-type-example__content mb-24"><div class="t-popover__wrapper"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->自定义内容</span></button></div><div data-popper-placement="top" class="t-popover" style="display:none"><div class="t-popover__content t-popover--dark t-popover__content--arrow"><div class="custom__list"><div class="custom__item">选项<!-- -->1</div><div class="custom__item">选项<!-- -->2</div><div class="custom__item">选项<!-- -->3</div></div><div class="t-popover__arrow" data-popper-arrow="true"></div></div></div></div></div></div>"`;
 
 exports[`ssr snapshot test > ssr test src/popup/_example/base.tsx 1`] = `"<div style="padding:0 16px"><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->顶部弹出</span></button><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->左侧弹出</span></button><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->中间弹出</span></button><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->底部弹出</span></button><button type="button" class="t-button t-button--size-large t-button--outline t-button--primary t-button--rectangle t-button--block" style="margin:16px 0"><span class="t-button__content"> <!-- -->右侧弹出</span></button><div class="t-popup t-popup--top" style="display:none;animation-fill-mode:forwards;padding:100px"></div></div>"`;