Obsidian裡生成破音字注音國字的方法
嗯，用户发来了一段看起来像是文章内容的文本，要求用中文总结一下，控制在100字以内，并且不需要特定的开头。首先，我需要仔细阅读并理解这篇文章的内容。 文章主要讲的是在Obsidian中添加注音的方法，包括使用注音字型档、HTML的<ruby>标签以及CSS调整注音位置。还有提到使用AutoHotkey脚本来快速输入注音。看起来用户可能是在学习如何在Obsidian中更高效地处理中文注音，可能是一位学生或者教育工作者。 接下来，我需要将这些内容浓缩到100字以内。重点包括注音字型档的安装、HTML标签的使用、CSS调整位置的方法，以及AutoHotkey脚本的使用。同时，要确保语言简洁明了，直接描述文章内容。 最后，检查一下是否符合用户的要求：中文总结、100字以内、没有特定开头。确保没有遗漏关键点，并且表达清晰。 </think> 文章介紹了在Obsidian中添加中文注音的方法，包括安裝注音字型檔、使用HTML的<ruby>標籤和CSS調整注音位置。還提供了AutoHotkey腳本來快速輸入注音內容。 2025-11-5 09:48:31 Author: jdev.tw(查看原文) 阅读量:3 收藏

我寫過與注音(或日文假名標註)相關的影片：

重點彙總如下：

1. 注音字型檔

直接使用帶有注音的字型檔就能將國字顯示成帶有注音的國字。操作步驟：

  1. 由 ButTaiwan/bpmfvs: 注音IVS字型規格 Bopomofo IVS Font Specification 下載能免費使用的ㄅ注音芫荽字型，並安裝到Windows系統，字型檔路徑：C:\Users\使用者帳號\AppData\Local\Microsoft\Windows\Fonts\BpmfIansui-Regular.ttf

  2. 在Obsidian安裝資料夾/.obsidian/snippets/資料夾裡建立一個任意名稱且副檔名為.css的文字檔，輸入下列內容：

    /* === 
font-family: "文鼎標楷注音";
*/
.yin {
font-size: 3em;
font-family: "ㄅ注音芫荽";
}

  3. 到Obsidian設定→【外觀】→【CSS片段】→點擊其右側的重整圖示，讓建立的CSS檔生效

  4. 筆記裡輸入下列內容測試是否能正確顯示注音 (周敦頤 《愛蓮說》)：

    <span class="yin">陶後鮮有聞</span>

▼ 顯示結果
gh|482

注音顯示正常，但可惜「鮮」是破音字，注音是「ㄒㄧㄢˇ」三聲才對。

2. 使用HTML的<ruby>標籤

在HTML裡可以使用<ruby>與<rt>標籤來標註注音，格式如下：



▼ 注音預設顯示在上方，也能用 <ruby style="ruby-position:under"> 改到下方


gh|100


gh|100


但有沒有辦法把注音移動到國字右側呢？畢竟注音在右比較符合我們一般的使用慣例。




[!tip] 用Markdown Furigawa外掛簡化輸入

<ruby>鮮<rt>ㄒㄧㄢˇ</rt></ruby>可以用 {鮮|ㄒㄧㄢˇ} 來簡化輸入。




3. 以CSS調整注音位置


再新增另一個CSS類別 .yin2 以調整注音位置到國字右側：


/* === 
  font-family: "文鼎標楷注音";
*/
.yin {
  font-size: 3em;
  font-family: "ㄅ注音芫荽";
}

ruby {
  font-size: 3em;
  /* 確保 ruby 註釋的位置是「上/右」方 */
  ruby-position: over; 
}

.yin2 {
  /* 將文字排版方向設定為從右到左的垂直方向 */
  writing-mode: vertical-rl;
}

.yin2 rt {
  /* 告訴瀏覽器：這個元素內的文字要保持直立，不隨容器的 writing-mode 旋轉 */
  text-orientation: upright;
  /* 讓注音符號字體小一點，更像注音樣式 */
  font-size: 0.6em;
}


在筆記裡插入下列內容：


陶後<span class="yin2"><ruby>鮮<rt>ㄒㄧㄢˇ</rt></ruby></span>有聞：少。


▼ 顯示結果：注音顯示在右側了

gh|295




[!warning]

在套用 .yin2 類別後，若使用Furigawa外掛會導致顯示不正常，因此只能使用<ruby>標籤。




3.1. 使用AutoHotkey以快速輸入


雖然破音字只是偶爾需要輸入，但我們仍可用下列AutoHotkey v2腳本來加速輸入效率：


^+y:: {
  send "^x"
  ClipWait 10
  if (A_Clipboard) {
    sendText "<span class='yin2'>" . A_Clipboard . "</span>"
  }
}

;; ruby
^+r:: {
  send "^x"
  ClipWait 10
  if (A_Clipboard) {
    sendText "<ruby>" . A_Clipboard . "<rt></rt></ruby>"
  }
}


將要使用的國字複製到系統剪貼簿後，按下Ctrl+Shift+Y即能產生好需要的內容。


4. 💡 相關鏈接


✅ 解說文章(繁體中文):  https://jdev.tw/blog/9015

✅ Explanation article(English)

✅ 解説記事(日本語)


✅ 國中生 國文 Anki牌組分享: https://jdev.tw/newlife/?tag=國文


＃＃


您可能也會有興趣的類似文章



          
        

                    


                    

                        文章来源: https://jdev.tw/blog/9015/obsidian-generate-phonetic-annotations-method
 如有侵权请联系:admin#unsafe.sh