obsidianのcssclassesでカスタムCSSのフォントを適用させる

フロントマターのcssclassesに値を書くと .view-content 直下のdivにその名前でクラスが追加される

cssclassesに変更したいやつを追加した結果:

<div class="
  markdown-source-view 
  cm-s-obsidian 
  mod-cm6 
  node-insert-event 
  is-live-preview 
  is-folding 
  show-properties 
  変更したいやつ"
  style="">

そして、ObsidianのVaultフォルダ/.obsidian/snippets に自作cssファイルを置いて設定から有効にしておくと、カスタムCSSを適用できる

なのでそれらを組み合わせると例えば歌詞のページはそれっぽくフォントを変えたり無限大にいろいろできるんだけど、なぜかfont-familyは適用されなくて困った。

CSS

最終的には以下のように書くと適用できた。
かなり雑なのでよろしくあれすること。

.変更したいやつ,
.変更したいやつ .cm-scroller {
    font-family: "HGP創英角ﾎﾟｯﾌﾟ体" !important;
    
    /* 適用できてるか分かりやすくするテスト */
    color: red;
    font-size: 30px;
}

Googleフォント

Googleフォントも使える

/* @import を先頭に書く */
@import url('https://fonts.googleapis.com/css2?family=Cherry+Bomb+One&display=swap');

.変更したいやつ,
.変更したいやつ .cm-scroller {
    font-family: "Cherry Bomb One" !important;
    
    /* 適用できてるか分かりやすくするテスト */
    color: orange;
    font-size: 30px;
}