拡張機能 Markdown Preview Github Styling の CSS 上書き

2023-09-27

#VS Code

#Markdown

#CSS

VSCode の Markdown プレビューに任意のスタイルを適用する

Overview

VSCode 拡張機能 Markdown Preview Github Styling は、ビルトインの Markdown プレビューを、Github 風に変更してくれるもの
この CSS を上書きし、更に好みの外観に変更する

Content

  1. ワークスペース設定でmarkdown.stylesに CSS ファイルを設定

    以下の仕様のため、共通設定とすることは出来ない模様

    実はワークスペース以下しか見ない仕様。

    settings.json
    {
      "markdown.styles": [".vscode/style.css"]
    }

  2. github-markdown-body要素に対して、変更したい CSS を記述

    Make sure you apply your styles to the .github-markdown-body instead of just body so they don’t get overridden by this extension

    style.css
    .github-markdown-body {
      // favourite styles
    }

Ref

Base

2023/7/23 15:18:39 の Note - Misskey.io