Color (syntax highlighting) within an HTML <code> tag

Question

In a code fragment like the following ...

class Foo
{
  internal Foo()
  {
    for (int i = 0; i < 42; ++i);
  }
}

... its various keywords and so on are color-coded when they're displayed in my browsers.

When I do "View source", I don't see anything special in the HTML that would implement this color-coding.

How and/or where is this syntax-specific color-highlighting implemented, then? For example is it built-in to the browsers, or is it implemented by site-specific JavaScript editing the DOM within the browsers?

I find this a difficult question to Google for.

Answer 1

It's a Javascript library. There are quite a few out there, the most popular being SyntaxHighlighter. My personal favorite is Chili, though.

Answer 2

Stackoverflow uses Google's prettify JS library for doing syntax highlighting. It executes on the client side after the HTML has been delivered by the server. That's why you don't see it in the raw HTML source. If you have a browser plugin such as FireBug, you'll be able to inspect the DOM after prettify has done its magic.