鏈接和圖片速查

鏈接語法

內聯鏈接

[鏈接文本](https://www.markdownlang.com)
[帶標題的鏈接](https://www.markdownlang.com "鏈接標題")

引用式鏈接

[鏈接文本][ref]
[鏈接文本][]

[ref]: https://www.markdownlang.com "可選標題"
[鏈接文本]: https://www.markdownlang.com

自動鏈接

<https://www.markdownlang.com>
<email@example.com>

錨點鏈接

[跳轉到標題](#標題名稱)
[返回頂部](#top)

圖片語法

內聯圖片

![替代文本](image.jpg)
![替代文本](image.jpg "圖片標題")

引用式圖片

![替代文本][img-ref]

[img-ref]: image.jpg "可選標題"

圖片鏈接

[![圖片替代文本](image.jpg)](https://www.markdownlang.com)

指定尺寸

<img src="image.jpg" alt="替代文本" width="300" height="200">

常用組合

帶鏈接的圖片

[![項目Logo](logo.png)](https://github.com/user/repo)

圖片居中

<div align="center">
  <img src="image.jpg" alt="描述">
</div>

並排顯示圖片

<img src="img1.jpg" width="48%"> <img src="img2.jpg" width="48%">

最佳實踐

類型	建議	示例
鏈接文本	使用描述性文本	✅ [用戶指南]()
鏈接文本	避免"點擊這裡"	❌ [點擊這裡]()
圖片文件	使用相對路徑	✅ ./images/pic.jpg
替代文本	描述圖片內容	✅ ![用戶界面截圖]()
文件格式	網絡友好格式	✅ JPG, PNG, WebP

HTML 輸出

Markdown	HTML
[text](url)	<a href="url">text</a>
	<img src="img" alt="alt">
<url>	<a href="url">url</a>

常見錯誤

❌ 錯誤示例：
[鏈接(https://www.markdownlang.com)     ← 缺少右括號
![圖片](image.jpg             ← 缺少右括號
[ 鏈接 ]( https://www.markdownlang.com ) ← 不必要的空格

✅ 正確示例：
[鏈接](https://www.markdownlang.com)
![圖片](image.jpg)
[鏈接](https://www.markdownlang.com)