277 lines
7.6 KiB
Markdown
277 lines
7.6 KiB
Markdown
<p align="center"><a href="https://xugaoyi.com/" target="_blank" rel="noopener noreferrer"><img width="180" src="../vuepress-theme-vdoing-doc/docs/.vuepress/public/img/logo.png" alt="logo"></a></p>
|
||
|
||
|
||
<h2 align="center">经创帮助中心编辑参考文档</h2>
|
||
|
||
<div style="background: #f8fafc; border: 2px solid #3b82f6; border-radius: 8px; padding: 20px; margin-bottom: 24px;">
|
||
<h3 style="color: #1e40af; margin: 0 0 16px 0; display: flex; align-items: center; font-size: 18px;">
|
||
🚨 <span style="margin-left: 8px;">【帮助中心文档编辑核心规则】</span>
|
||
</h3>
|
||
<div style="color: #334155; line-height: 2; font-size: 15px;">
|
||
<p style="margin: 0 0 12px 0;">
|
||
📁 <strong style="color: #dc2626;">文件夹路径规则</strong>：在 <span style="background: #fef2f2; padding: 2px 6px; border-radius: 3px;">help-center</span> 文件夹下的 <span style="background: #fef2f2; padding: 2px 6px; border-radius: 3px;">vuepress-theme-vdoing-doc/docs/</span> 文件夹下新建文件夹；
|
||
</p>
|
||
<p style="margin: 0 0 12px 0;">
|
||
✏️ <strong style="color: #059669;">页面改造规则</strong>：<span style="color: #dc2626; font-weight: bold; font-size: 16px;">第一个测试页面不可删除</span>，这是帮助中心的入口页面，请勿删除(可以改造)！
|
||
</p>
|
||
<p style="margin: 0 0 12px 0;">
|
||
💡 <strong style="color: #d97706;">编写建议</strong>：因为编写完成后页面不会实时刷新，需要重新启动服务才能看到效果。建议将编写好的MD格式文件复制到目录下后重新打包构建后刷新页面查看效果。
|
||
</p>
|
||
<p style="margin: 0 0 12px 0;">
|
||
📋 <strong style="color: #7c3aed;">命名规则</strong>：<br>
|
||
▪ 文件夹命名规则: 页面名称（无后缀）<br>
|
||
▪ 文件命名规则: 功能名称.md；
|
||
</p>
|
||
<p style="margin: 0 0 12px 0;">
|
||
📦 <strong style="color: #2563eb;">打包部署规则</strong>：确认无误后进入 <span style="background: #fef2f2; padding: 2px 6px; border-radius: 3px;">vuepress-theme-vdoing-doc</span> 路径执行 <code style="background: #f1f5f9; padding: 2px 6px; border-radius: 3px; color: #d21818;">npm run build:win</code>(仅Windows系统需要加win) 打包命令
|
||
</p>
|
||
<p style="margin: 0; color: #d51414; font-weight: bold;">
|
||
⚠️ 警告：如果帮助中心不放在当前路径下，请将配置文件中的打包路径改成自定义路径，否则会丢失JS和CSS样式。<br>
|
||
配置文件路径：docs/.vuepress/config.js
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
📚 MarkDown基本语法大全
|
||
|
||
以下整理了MarkDown常用基础语法，涵盖标题、文本样式、列表等核心功能，附写法示例与显示效果，适合新手快速上手。
|
||
|
||
一、标题语法
|
||
|
||
说明：通过「#」符号表示标题，# 数量对应标题层级（1-6级），# 与标题文本间需留一个空格，层级越高字体越小。
|
||
|
||
📝 写法示例：
|
||
|
||
\# 一级标题
|
||
|
||
\#\# 二级标题
|
||
|
||
\#\#\# 三级标题
|
||
|
||
\#\#\#\# 四级标题
|
||
|
||
\#\#\#\#\# 五级标题
|
||
|
||
\#\#\#\#\#\# 六级标题
|
||
|
||
|
||
✨ 显示效果：
|
||
|
||
# 一级标题
|
||
## 二级标题
|
||
### 三级标题
|
||
#### 四级标题
|
||
##### 五级标题
|
||
###### 六级标题
|
||
|
||
二、文本样式
|
||
|
||
📝 写法示例：
|
||
|
||
\*\*加粗文本\*\*
|
||
|
||
\*斜体文本\*
|
||
|
||
\*\*\*加粗斜体文本\*\*\*
|
||
|
||
\~\~删除线文本\~\~
|
||
|
||
<u>下划线文本</u>
|
||
|
||
\=\=高亮文本\=\=（部分编辑器支持，如Typora）
|
||
|
||
\> 引用文本（块引用）
|
||
|
||
\>\> 嵌套引用文本（二级引用）
|
||
|
||
\`行内代码片段\`
|
||
|
||
|
||
✨ 显示效果：
|
||
|
||
**加粗文本**
|
||
*斜体文本*
|
||
***加粗斜体文本***
|
||
~~删除线文本~~
|
||
<u>下划线文本</u>
|
||
==高亮文本==
|
||
> 引用文本（块引用）
|
||
>> 嵌套引用文本（二级引用）
|
||
行内代码示例：`print("Hello MarkDown")`
|
||
|
||
三、列表
|
||
|
||
1. 无序列表（符号可选：-、*、+，符号后需留空格）
|
||
|
||
📝 写法示例：
|
||
|
||
\-\- 无序列表项 1
|
||
|
||
\- 无序列表项 2
|
||
\- 子列表项 2.1（前面缩进4个空格）
|
||
\- 子列表项 2.2
|
||
|
||
\* 无序列表项 A
|
||
\* 无序列表项 B
|
||
|
||
\+ 无序列表项 X
|
||
\+ 无序列表项 Y
|
||
|
||
✨ 显示效果：
|
||
|
||
- 无序列表项 1
|
||
- 无序列表项 2
|
||
- 子列表项 2.1（前面缩进4个空格或1个Tab）
|
||
- 子列表项 2.2
|
||
|
||
* 无序列表项 A
|
||
* 无序列表项 B
|
||
|
||
+ 无序列表项 X
|
||
+ 无序列表项 Y
|
||
|
||
-
|
||
|
||
2. 有序列表（数字+英文句点+空格，自动排序）
|
||
|
||
📝 写法示例：
|
||
|
||
1. 有序列表项 1
|
||
2. 有序列表项 2
|
||
1. 子列表项 2.1（前面缩进4个空格）
|
||
2. 子列表项 2.2
|
||
3. 有序列表项 3
|
||
1.
|
||
|
||
3. 任务列表（结合无序列表与复选框，部分编辑器支持）
|
||
4. 有序列表不会认定前面数字改变，从1开始排序，数字会自动序号并不会根据你输入的数字排序
|
||
|
||
✨ 显示效果：
|
||
|
||
1. 有序列表项 1
|
||
2. 有序列表项 2
|
||
1. 子列表项 2.1（缩进后自动续号）
|
||
2. 子列表项 2.2
|
||
3. 有序列表项 3
|
||
|
||
4.
|
||
|
||
5. 任务列表（结合无序列表与复选框，部分编辑器支持）
|
||
|
||
有序列表和无序列表的区别是quote（引用）标签不能嵌套，但无序列表可以嵌套。
|
||
|
||
📝 写法示例：
|
||
|
||
\-[x] 已完成任务 1
|
||
\-[x] 已完成任务 2
|
||
\-[ ] 未完成任务 3
|
||
\-[ ] 未完成任务 4
|
||
|
||
✨ 显示效果：
|
||
|
||
- [x] 已完成任务 1
|
||
- [x] 已完成任务 2
|
||
- [ ] 未完成任务 3
|
||
- [ ] 未完成任务 4
|
||
|
||
四、链接与图片
|
||
|
||
1. 链接（两种写法：行内链接、参考链接）
|
||
|
||
📝 写法示例：
|
||
|
||
# 行内链接（直接显示链接文本与地址）
|
||
\[百度一下\](https://www.baidu.com "百度首页 - 悬停提示文本")
|
||
|
||
# 参考链接（适合多次引用同一链接）
|
||
\[MarkDown官方文档\]\[1\]
|
||
\[GitHub\]\[2\]
|
||
|
||
\[1\]: https://daringfireball.net/projects/markdown/ "MarkDown官方指南"
|
||
\[2\]: https://github.com/ "GitHub官网"
|
||
|
||
✨ 显示效果：
|
||
|
||
行内链接：[百度一下](https://www.baidu.com "百度首页 - 悬停提示文本")
|
||
参考链接：[MarkDown官方文档][1]、[GitHub][2]
|
||
|
||
[1]: https://daringfireball.net/projects/markdown/ "MarkDown官方指南"
|
||
[2]: https://github.com/ "GitHub官网"
|
||
|
||
2. 图片（语法与链接类似，前缀加!）
|
||
|
||
📝 写法示例：
|
||
|
||
# 行内图片
|
||
\![风景图]\(https://picx.zhimg.com/v2-d6f44389971daab7e688e5b37046e4e4_720w.jpg?source=172ae18b)
|
||
|
||
# 参考图片
|
||
\![Logo]\[img1]
|
||
|
||
\[img1]: https://www.logosc.cn/uploads/articles/2022/10/20/16662553442591813.png "品牌Logo"
|
||
|
||
✨ 显示效果：
|
||
|
||
行内图片：
|
||
|
||
参考图片：![Logo][img1]
|
||
|
||
[img1]: https://www.logosc.cn/uploads/articles/2022/10/20/16662553442591813.png "品牌Logo"
|
||
|
||
五、分割线
|
||
|
||
说明：三种写法均可，需单独成行，前后建议空一行，避免与其他内容混淆。
|
||
|
||
📝 写法示例：
|
||
|
||
\---
|
||
|
||
\***
|
||
|
||
\___
|
||
|
||
✨ 显示效果：
|
||
|
||
---
|
||
***
|
||
___
|
||
|
||
六、表格（支持对齐设置）
|
||
|
||
📝 写法示例：
|
||
|
||
# 基础表格（| 分隔列，- 分隔表头与内容）
|
||
\| 姓名 | 年龄 | 职业 |
|
||
|
||
\| ---- | ---- | ---- |
|
||
|
||
\| 张三 | 25 | 程序员 |
|
||
|
||
\| 李四 | 30 | 设计师 |
|
||
|
||
# 带对齐的表格（: 表示对齐方向）
|
||
\| 左对齐 | 居中对齐 | 右对齐 |
|
||
|
||
\| :----- | :------: | -----: |
|
||
|
||
\| 内容1 | 内容2 | 内容3 |
|
||
|
||
\| 文本A | 文本B | 文本C |
|
||
|
||
✨ 显示效果：
|
||
|
||
| 姓名 | 年龄 | 职业 |
|
||
| ---- | ---- | ---- |
|
||
| 张三 | 25 | 程序员 |
|
||
| 李四 | 30 | 设计师 |
|
||
|
||
| 左对齐 | 居中对齐 | 右对齐 |
|
||
| :----- | :------: | -----: |
|
||
| 内容1 | 内容2 | 内容3 |
|
||
| 文本A | 文本B | 文本C |
|
||
|
||
|
||
|
||
|
||
* 更多md语法请参考以下链接
|
||
* [Markdown 语法参考](https://markdown.com.cn/basic-syntax/) |