Stack Overflow использует JS-библиотеку prettify от Google для выделения синтаксиса. Он выполняется на стороне клиента после того, как сервер доставил HTML-код. Вот почему вы не видите его в исходном HTML-коде. Если у вас есть плагин для браузера, например FireBug, вы сможете проверить DOM после того, как prettify сделает свое чудо.

Обновление 2020-09-14: Stack Overflow перешел с prettify от Google на highlight.js.

На meta.SE есть отличные ответы на часто задаваемые вопросы Что такое подсветка синтаксиса и как она работает?

Я полностью цитирую его здесь для вашего удобства, но вы можете проверить исходный пост на предмет обновлений для списка поддерживаемых языков.

Что такое подсветка синтаксиса?

Подсветка синтаксиса позволяет выделять код в сообщениях в зависимости от языка, на котором он написан, чтобы его было легче читать.

Как это работает?

Stack Exchange не имеет собственного механизма выделения синтаксиса. Он использует Google Code Prettify < / а>. Следовательно, любые ошибки и запросы функций, касающиеся подсветки синтаксиса, не могут обрабатываться Stack Exchange и должны быть направлены команде разработчиков Google Code Prettify.

Prettify поддерживает список основные языки, которые он может выделить (включая C / C ++, C #, Java, JavaScript / CoffeScript, Perl, Python, Ruby , Regex, Bash, HTML, XML) вместе с универсальным маркером по умолчанию, который удовлетворительно работает на большинстве языков C-подобных и языков разметки типа HTML. Дополнительные языки реализованы как расширения (каждый lang-*.js файл).

Почему мой код подсвечивается неправильно?

Если ваш пост не имеет правильного выделения, возможно, он не поддерживается. См. список поддерживаемых Prettify языки. Если вашего языка нет в списке, его необходимо создать в проекте Prettify, прежде чем его можно будет развернуть с помощью Stack Exchange.

Если язык, который можно применить к тегу, уже есть в списке, но не используется в Stack Exchange, подайте запрос функции здесь, в Meta, чтобы развернуть его в сети.

Как мне сообщить об ошибке или запросить новый язык?

Если это действительно ошибка в самом выделителе синтаксиса, проверьте список проблем, чтобы увидеть если об этом уже сообщалось. Если нет, сообщите об этом или присоединитесь к проекту и отправьте исправление самостоятельно. Если вы хотите, чтобы возникшая проблема была быстро решена, лучше включить исправление в отчет. Если исправление уже реализовано Prettify, но здесь все еще не работает, подайте запрос функции в Meta, чтобы запросить развертывание новой версии Prettify.

Вы также можете отправить запрос на добавление нового языка в тот же список проблем . Имейте в виду, что Stack Exchange не поддерживает эту подсветку синтаксиса, и публикация отчетов об ошибках или запросов функций, касающихся этого, здесь, в Meta, не приведет к их исправлению или внедрению.

Прежде чем что-либо делать, убедитесь, что у вас включена правильная подсветка.

Как он определяет язык подсветки синтаксиса?

За кулисами Stack Exchanges использует теги в вопросе, чтобы определить, на каком языке вы говорите. с использованием. Если существует несколько тегов с подсветкой синтаксиса, он использует значение по умолчанию и позволяет Prettify определять, какой язык лучше всего использовать.

Если вам интересно, есть ли в теге языковая подсказка, любой пользователь может проверить, посетив вики-страницу этого тега. Подсказка языка (если есть), которая в настоящее время используется для этого тега, будет отображаться в самом низу, под кнопками для вики:

Можно явно переопределить используемое выделение для выбранного языка, указав языковую подсказку над блоком кода. :

<!-- language: lang-or-tag-here -->

    code goes here

Вы можете использовать либо код языка, либо имя тега в подсказке по языку, чтобы активировать подсветку синтаксиса. См. Ниже полный список поддерживаемых prettify языковых кодов.

Например:

Here is a code block with language code as hint:

<!-- language: lang-js -->

    function greet(person) {
        return "Hello " + person;
    }
    var user = "John Doe";
    alert(greet(user));

Here is a code block with tag name as hint:

<!-- language: typescript -->

    var arr = [0, 1, 2];

Если вы не хотите выделять синтаксис, вы можете использовать lang-none язык:

<!-- language: lang-none -->

Вы также можете применить языковую подсказку ко всем блокам кода в вашем сообщении (так что вам не нужно добавлять подсказку перед каждым из них):

<!-- language-all: lang-or-tag-here -->

Подсказка: языковые коды

Это полный список всех идентификаторов, которые вы можете использовать в языковой подсказке для выделения синтаксиса.

Основной:

• По умолчанию: пусть Prettify интерпретирует код и угадывает
  default
• Нет: явно не использовать подсветку синтаксиса
  lang-none
• Bash и другие сценарии оболочки
  lang-bash, lang-bsh, lang-csh, lang-sh
• C, C ++, Objective-C и др.
  lang-c, lang-cc, lang-cpp, lang-cxx, lang-cyc, lang-m
• C #
  lang-cs
• CoffeeScript
  lang-coffee
• HTML, XML, XSL и др.
  lang-html, lang-xml, lang-xsl
• Java
  lang-java
• JavaScript
  lang-js, lang-javascript
• JSON
  lang-json
• Perl
  lang-pl, lang-perl
• Python
  lang-py, lang-python, lang-cv
• Регулярное выражение
  lang-regex
• Рубин
  lang-rb, lang-ruby
• Ржавчина
  lang-rc, lang-rs, lang-rust

Расширения:

• Clojure
  lang-clj
• CSS
  lang-css
• Дарт
  lang-dart
• Эрланг
  lang-erl, lang-erlang
• Перейти
  lang-go
• Haskell
  lang-hs
• LaTeX, TeX
  lang-latex, _ 47_
• Лисп, схема
  lang-cl, lang-el, _ 50_, lang-lsp, lang-scm, lang-ss, lang-rkt
• Lua
  lang-lua
• MATLAB
  lang-matlab
• OCaml, SML, F # и др.
  lang-fs, _ 58_
• Паскаль, Delphi
  lang-pascal
• Буферы протокола
  lang-proto
• R, S
  lang-r, lang-s
• Scala
  lang-scala
• SQL
  lang-sql
• VHDL
  lang-vhdl, lang-vhd
• Visual Basic, VBScript
  _ 67_, lang-vbs

Намек: Теги

Вы можете указать любой тег, который существует на сайте, и он будет использовать любой языковой код, связанный в данный момент с этим тегом (который может иметь значение null (без подсказки), по умолчанию или конкретный код языка).

Имейте в виду, что по умолчанию все теги начинаются с none в качестве кода языка. Теги, для которых в качестве кода языка указан none, будут проигнорированы и заменены на default.

Вы также можете использовать ключевое слово plain none, чтобы вручную не указывать подсветку синтаксиса, аналогично использованию кода lang-none выше.

Примечание для редакторов:

Не добавляйте в приведенный выше список, если вы не уверены на 100%, что он существует. Просто потому, что вы вводите что-то, и это выглядит так, как будто оно выделено правильно не означает, что идентификатор действительно существует в системе. Помните, что для недопустимых идентификаторов возвращается значение по умолчанию. При добавлении новой подсказки в список укажите ссылку на мета-вопрос, подтверждающий наличие подсказки в сводке редактирования.

Примечание для комментаторов:

Комментарии к этому FAQ предназначены для того, чтобы попросить разъяснить то, что вы, возможно, не понимаете в FAQ, чтобы это можно было исправить. НЕ спрашивайте, будут ли в будущем поддерживаться определенные языки. Это не вопрос, на который мы можем ответить, потому что Stack Exchange не поддерживает эту подсветку. Посетите Google Code Prettify для получения языковой поддержки.

Это библиотека Javascript. Их довольно много, самая популярная из которых - SyntaxHighlighter. Лично мне больше всего нравится Чили.