🔗 链接语法示例
本文档详细介绍纸鸢博客中支持的所有链接语法特性，包含完整的语法示例和效果展示。
💡 提示：本文档中的所有语法示例均已在纸鸢博客中测试通过，可直接复制使用。
🎯 基础链接语法
1️⃣ 文本链接
语法：
[链接文本](https://gl.baimu.live)效果： 链接文本
2️⃣ 带标题的链接
语法：
[链接文本](https://gl.baimu.live "悬停时显示的标题")效果： 链接文本
将鼠标悬停在链接上查看标题
3️⃣ 自动链接
语法：
<https://gl.baimu.live>
<user@example.com>效果： https://gl.baimu.live user@example.com
使用尖括号包裹的 URL 会自动转换为链接
🎨 链接类型示例
4️⃣ 外部链接
语法：
[GitHub](https://github.com)
[Vue.js 官网](https://vuejs.org)
[MDN 文档](https://developer.mozilla.org)5️⃣ 内部链接（相对路径）
语法：
[首页](/)
[关于我们](/about)
[文章列表](/posts)
[上一篇文章](../previous-post)效果说明：
/表示网站根目录./表示当前目录../表示上级目录
6️⃣ 锚点链接（页面内跳转）
语法：
[跳转到第一章](#第一章)
[跳转到结论](#结论)
## 第一章
内容...
## 结论
内容...效果： 跳转到页面顶部
点击可跳转到页面顶部
7️⃣ 邮箱链接
语法：
[发送邮件](mailto:contact@example.com)
[发送邮件带主题](mailto:contact@example.com?subject=咨询)8️⃣ 电话链接
语法：
[拨打电话](tel:+8613800138000)效果： 拨打电话
在移动设备上点击可直接拨打电话
🌟 高级链接用法
9️⃣ 引用式链接
语法：
[链接文本][引用标识]
[引用标识]: https://gl.baimu.live "标题"
[GitHub][1]
[Vue][2]
[1]: https://github.com
[2]: https://vuejs.org "Vue.js 官网"引用式链接可以让文档更整洁，链接定义可以放在文档末尾
🔟 简化引用式链接
语法：
[Google][]
[GitHub][]
[Google]: https://google.com
[GitHub]: https://github.com当引用标识与链接文本相同时，可以省略引用标识
1️⃣1️⃣ 链接中包含代码
语法：
[`npm install` 文档](https://docs.npmjs.com/cli/install)
[`vue-router` GitHub](https://github.com/vuejs/router)效果：
npm install 文档
vue-router GitHub
1️⃣2️⃣ 链接中包含强调
语法：
[**重要文档**](https://gl.baimu.live)
[*推荐资源*](https://gl.baimu.live)
[~~已废弃~~](https://gl.baimu.live)📋 实用链接示例
1️⃣3️⃣ 导航链接组
语法：
快速导航：
[首页](/) | [文档](/docs) | [关于](/about) | [联系](/contact)1️⃣4️⃣ 资源链接列表
语法：
## 推荐资源
- [Vue.js 官方文档](https://vuejs.org) - 渐进式 JavaScript 框架
- [Vite 构建工具](https://vitejs.dev) - 下一代前端构建工具
- [TypeScript 手册](https://www.typescriptlang.org/docs) - JavaScript 的超集
- [MDN Web 文档](https://developer.mozilla.org) - Web 技术权威文档效果：
推荐资源
- Vue.js 官方文档 - 渐进式 JavaScript 框架
- Vite 构建工具 - 下一代前端构建工具
- TypeScript 手册 - JavaScript 的超集
- MDN Web 文档 - Web 技术权威文档
1️⃣5️⃣ 带图标的链接
语法：
[📚 文档](https://docs.example.com)
[💻 GitHub](https://github.com/example)
[🐦 Twitter](https://twitter.com/example)
[📧 邮箱](mailto:contact@example.com)效果： 📚 文档 💻 GitHub 🐦 Twitter 📧 邮箱
💡 最佳实践
1️⃣ 使用有意义的链接文本
<!-- 好的示例 -->
[Vue.js 官方文档](https://vuejs.org)
[下载最新版本](https://gl.baimu.live/download)
<!-- 不好的示例 -->
[点击这里](https://vuejs.org)
[链接](https://gl.baimu.live/download)2️⃣ 外部链接标识
对于外部链接，可以考虑添加标识：
[GitHub ↗](https://github.com)
[外部链接 🡕](https://gl.baimu.live)3️⃣ 链接可访问性
- 确保链接文本描述清楚
- 为链接添加标题属性提供额外信息
- 避免使用 “点击这里” 这类模糊的链接文本
4️⃣ 链接维护
- 定期检查链接有效性
- 使用相对路径引用站内资源
- 对于重要外部链接，考虑添加备用链接
📝 示例文档模板
---
title: 文档标题
description: 文档描述
date: 2026-04-03
tags: 标签1、标签2
cover: /assets/cover-image.jpg
url: /custom-path
---
# 文档标题
## 相关链接
- [官方文档](https://gl.baimu.live/docs)
- [GitHub 仓库](https://github.com/example/repo)
- [在线演示](https://demo.example.com)
## 联系方式
- [发送邮件](mailto:contact@example.com)
- [访问主页](https://gl.baimu.live)🕊️ 白木 原创开发 🔗 gl.baimu.live