HTMLの<code>タグの構文強調表示色の設定

Question

このようなコード スニペットでは...

 クラス Foo
    {
      内部Foo()
      {
        for (int i = 0; i < 42; i);
      }
    }

... ブラウザで表示すると様々なキーワードなどが色付けされます。

[ソースを表示] をクリックすると、この色付けを実現するための特別な HTML コードが表示されません。

では、特定の構文を色で強調表示する機能はどのように実装されているのでしょうか?たとえば、ブラウザに組み込まれているのでしょうか、それともブラウザで DOM を編集する Web サイト固有の JavaScript を通じて実装されているのでしょうか?

これは Google 検索で答えるのが難しい質問であることがわかりました。

Answer 1

meta.SE には非常に優れた FAQ があります。 構文の強調表示とは何ですか?また、どのように機能しますか? 。

とても詳しいですね。便宜上、あなたの質問に最も関連する部分を引用します:

---

それはどのように機能しますか?

投稿を作成または編集する場合、質問の tag に基づいて、入力を停止してから 5 秒後に構文の強調表示がプレビューに割り当てられます。

Stack Exchange には独自の構文強調表示エンジンがありません。 これは highlight.js を使用しますが、必ずしもそのライブラリの最新バージョンを使用するとは限りません。したがって、構文の強調表示に関するバグや機能リクエストは、Stack Exchange では処理できません。

コードが正しく強調表示されないのはなぜですか?

[元の投稿を読み続けます... ]

Answer 2

Stack Overflow は、構文の強調表示に Google の prettify JS ライブラリを使用します。 HTMLがサーバーからクライアントに送信された後に実行されます。そのため、元の HTML ソース コードにはそれが表示されません。 FireBug のようなブラウザ プラグインがインストールされている場合は、prettify の完了後に DOM を検査できます。

更新 2020-09-14: Stack Overflow は Google の prettify から highlight.js に切り替わりました。