範例文章：文章格式與步驟輪播示範

這是建站時自動產生的範例文章

用來示範文章慣例與輪播寫法，正式上線前可整篇刪除（連同 images/posts/ai-tools/sample-claude-code-workflow/ 圖片資料夾）。

文章開頭先用一兩段說明這篇要解決什麼問題。標題上方的分類、更新日期與標籤，是由 frontmatter 自動產生的，不需要在內文重複。

一般圖片

在 VS Code 直接貼上圖片，會自動存到 images/posts/<分類>/<文章檔名>/ 並插入相對路徑：

這是一張一般圖片，貼上後直接可以在 dev 模式預覽

多個操作步驟的截圖（高度比例可以不同），用 carousel 容器包起來。輸入 carousel 後按 Tab 可以直接展開 snippet：

步驟一：先開啟設定頁面，找到對應的選項

步驟二：這張截圖比例不同，輪播高度會自動調整

步驟三：完成設定後儲存，畫面會顯示成功訊息

圖片的 alt 文字會顯示在輪播下方，作為該步驟的說明，手機上也可以直接左右滑動。