css - MkDocs マテリアル テーマにカスタム インライン スタイルを追加する方法

Question

カスタム スタイルをマークダウン ページに追加する方法を探していました。yml ファイルに「extra_css」を追加することはできましたが、それは生成された html にのみ影響するようです。たとえば、すべての項目を中央に配置する画像のカスタム スタイルを追加できました。

の行に沿って何かを使用して属性を追加する方法があることを知っています

{: #someid .someclass somekey='some value' }

したがって、これは 2 つの部分からなる質問です。

1. スタイルはどこで作成しますか? yml で宣言されたカスタム css ファイルでは?

例: extra_css:
-custom.css

2. マークダウンでそれらをインラインで参照 (適用) するにはどうすればよいですか?

Answer 1

スタイルはどこで作成しますか? yml で宣言されたカスタム css ファイルでは?

はい、構成ファイルのextra_css構成設定にリストしたのと同じ名前で、 docs_dir (デフォルトの場所は) にファイルを作成します。次に、そのファイル内で任意の CSS を定義できます。詳細については、ドキュメントの「テーマのカスタマイズ」セクションを参照してください。docs/mkdocs.yml

マークダウンでそれらをインラインで参照 (適用) するにはどうすればよいですか?

属性リスト拡張機能を有効にする必要があります。mkdocs.yml構成ファイルで、markdown_extensionsのリストに拡張子を含めます。

markdown_extensions:
    - attr_list

次に、Markdown ドキュメントで属性リストを使用して、クラスなどをさまざまな要素に割り当てることができます。