そんな機能はないようなので、HTMLタグとCSSを使うことにする。
Snippet登録すれば入力も楽!
Snippetへの登録
- Ctrl(MacならCommand)+Shift+P でコマンド入力欄が表示されるので、「Snippet」と入力する。
- 「ユーザ スニペットの構成」を選ぶ。
- 「markdown」と入力して表示された項目を選べば、設定用のJSONが開く。
- コメントで説明文が色々書いてあるので、その下に↓みたいなのを記述する。
- 重要なのは、
prefix
とbody
- 重要なのは、
"Input with color red": { // スニペットの名前
"prefix": "red", // プレフィックスの設定。これを入力すると、↓の"body" の文字列に変換できる。
"body": [ // 変換後の値。1行が配列の1要素になる(と思う)。
"<span style='color: #F00;'>$1</span>$2"
// ↑変換後の文字列。変換後にTabキー押下で $1 -> $2 -> ... の順にジャンプできる (はず)。
],
"description": "Input with color red" // スニペットの説明。
}
- 保存する。
- Markdownファイルを開いて、
prefix
に設定した文字を入力して、Tabキーで変換。 - 変換後、
<span ~>
と</span>
の間に文字列を入力すると、そこの文字が赤くなる。
TabでSnippetが変換できない!
Tabで変換するには以下の設定がいるようだった。
- 設定を開く。
- ユーザ設定のところに↓の「その1」「その2」のどちらかを追加する。
"editor.tabCompletion": true, // その1
"[markdown]": {
"editor.quickSuggestions": true // その2
}
- 保存する。
- Markdownファイルを開いて、
prefix
に設定した文字を入力して、Tabキーで変換。 - 変換後、
<span ~>
と</span>
の間に文字列を入力すると、そこの文字が赤くなる。
これで
テキストに文字色をつけられた!