Prompt
obsidian、そしてquartzでその記事にのみ適用されるcssを定義することは可能？
(<head>内に書く<style>のように)
Obsidian、そしてQuartzの両方で**「特定の記事にのみ適用されるCSS」**を定義することは可能ですよ！
それぞれのアプローチを紹介しますね。
1. Obsidianでの方法：もっとも簡単なのはHTMLタグ
ObsidianのエディタはMarkdownの中に直接HTMLを書くことができるので、記事のどこかに <style> タグを埋め込むだけで、その記事（表示されているプレビュー）にのみスタイルが適用されます。
<style>
/* この記事だけの特別ルール */
body {
background-color: #f0f0f0;
}
.markdown-preview-view h1 {
color: coral;
}
</style>
# この記事の見出しはコーラルピンクになります- 注意点: Obsidian内では、このスタイルが他のタブに影響を与える（リークする）ことがたまにあります。より厳格にやりたい場合は、「cssclass」フロントマターとCSSスニペットを組み合わせるのが王道です。
2. Quartzでの方法：ObsidianFlavoredMarkdown が鍵
君が使っているQuartzでも、基本的には同じようにMarkdown内に <style> タグを書くことで適用可能です。
Quartzの設定（quartz.config.ts）を確認すると、Plugin.ObsidianFlavoredMarkdown のオプションで enableInHtmlEmbed: true が指定されていますね。
この設定のおかげで、QuartzはHTML埋め込みの中にあるMarkdown的な要素（WikilinksやTagsなど）をパースしようとしますが、同時に標準的なHTMLタグである <style> もそのままHTMLとして出力してくれます。
🚀 実装のコツ：特定のページを狙い撃つ
Quartzで特定の記事だけにスタイルを当てたいなら、フロントマターの cssclasses（または cssclass）を利用するのがスマートです。
-
Markdown側:
--- title: 特別なページ cssclasses: - my-special-page --- -
quartz/styles/custom.scss側:/* 全体に影響させず、特定のクラスを持つページだけ変える */ body:has(.my-special-page) { background: linear-gradient(to bottom, #1a1b26, #24283b); }※Quartzが生成するHTMLの
articleやdivに、フロントマターで指定したクラスが付与される仕組みを利用します。
💡 結論
-
手っ取り早くやりたい: 記事内に直接
<style> ... </style>を書く。 -
綺麗に管理したい: フロントマターでクラス名を指定し、
custom.scssでそのクラスに対してスタイルを書く。
情報工学徒としては、共通の custom.scss で「クラス名ベース」の管理をするほうが、コードの再利用性や保守性の観点から「美しい」と感じるかもしれませんね！🌱
次は、特定のクラスを使って、特定のページだけフォントや色をガラッと変えてみますか？