MDX Components Showcase
MDX 组件展示
本页面展示了博客系统中所有可用的自定义 MDX 组件。
1. 提示框 (Callout)
信息提示
这是一条普通的信息提示。
注意
请注意,这是一条警告信息。
错误
操作失败,请检查配置。
技巧
这是一个有用的小技巧。
2. 选项卡 (Tabs)
使用 :::tabs 创建切换面板。
React 是一个用于构建用户界面的 JavaScript 库。
Vue 是一款用于构建用户界面的渐进式框架。
Svelte 是一种构建用户界面的全新方法。
3. 按钮系统 (Buttons)
独立按钮
按钮组 (Grid)
4. 折叠框 (Folding)
▶ 点击查看详细代码
console.log("Hello World");▶ 默认展开的折叠框
这个折叠框默认是展开状态。
5. 隐藏内容 (Hidden)
行内隐藏
这段文字包含 ,请谨慎点击。
块级隐藏
6. 时间轴 (Timeline)
2025-01-01 项目启动
项目正式立项,确定技术栈为 Astro + React。
2025-02-15 发布Beta版
完成了核心功能开发,上线测试。
2025-03-01 正式发布
修复了所有已知 Bug,向公众开放。
7. 图片画廊 (Gallery)
8. 数学公式 (Math)
行内公式:
块级公式:
9. 终极嵌套测试 (Deep Nesting)
这里展示组件之间的相互嵌套能力。
Step 1 基础
学习 HTML, CSS, JavaScript。
Step 2 框架
学习 React 或 Vue。
▶ 打开百宝箱
这里有一些 。
Warning
请勿外传!
喜欢这篇文章的人还看了下面这些文章
评论
0QQ
加载评论中...