i18n(zh-cn): Update styling.mdx

huyikai · huyikai · commit 9a38dea30285 · 2024-01-12T09:20:34.000+08:00
diff --git a/src/content/docs/zh-cn/guides/styling.mdx b/src/content/docs/zh-cn/guides/styling.mdx
@@ -5,6 +5,7 @@ description: >-
 ---
 import Since from '~/components/Since.astro';
 import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
+import ReadMore from '~/components/ReadMore.astro'
 
 Astro 的设计为了使设计和编写 CSS 变得轻而易举。直接在 Astro 组件中编写你自己的 CSS，或者导入你最喜欢的 CSS 库，如 [Tailwind][tailwind] 外。也支持高级样式设计语言，如 [Sass][sass] 和 [Less][less]。
 
@@ -103,7 +104,7 @@ const { isRed } = Astro.props;
 </style>
 ```
 
-📚 参见[指令参考](/zh-cn/reference/directives-reference/#classlist)页面，了解更多关于 `class:list` 的信息。
+<ReadMore>参见 [指令参考](/zh-cn/reference/directives-reference/#classlist) 页面，了解更多关于 `class:list` 的信息。</ReadMore>
 
 ### CSS 变量
 
@@ -125,7 +126,7 @@ const backgroundColor = "rgb(24 121 78)";
 <h1>Hello</h1>
 ```
 
-📚 参见[指令参考](/zh-cn/reference/directives-reference/#definevars)页面，了解更多关于 `define:vars` 的信息。
+<ReadMore>参见 [指令参考](/zh-cn/reference/directives-reference/#definevars) 页面，了解更多关于 `define:vars` 的信息。</ReadMore>
 
 ### 传递 `class` 给子组件
 
@@ -173,7 +174,7 @@ import MyComponent from "../components/MyComponent.astro"
 
 有两种使用外部全局样式表的方法：项目源文件中使用 ESM 导入；使用绝对链接引用 `public/` 目录中的文件或托管于别处的文件。
 
-📚 阅读更多关于使用位于 `public/` 或 `src/` 的[静态资源](/zh-cn/guides/imports/)。
+<ReadMore>阅读更多关于使用位于 `public/` 或 `src/` 的 [静态资源](/zh-cn/guides/imports/) 的内容。</ReadMore>
 
 ### 导入本地样式表
 
@@ -447,7 +448,7 @@ Astro 支持在项目中添加流行的 CSS 库、工具和框架，如 [Tailwin
   </Fragment>
 </PackageManagerTabs>
 
-📚 参见[集成指南](/zh-cn/guides/integrations-guide/)，了解安装、导入和配置这些集成的说明。
+<ReadMore>参见 [集成指南](/zh-cn/guides/integrations-guide/)，了解安装、导入和配置这些集成的说明。<ReadMore>
 
 ## CSS 预处理器
 
