Code Highlighting Example

Demonstrates syntax highlighting for C#, SQL, Blazor, and PowerShell using the HTML <code> tag and Prism.js.

public class HelloWorld
{
    public static void Main()
    {
        Console.WriteLine("Hello, World!");
    }
}

How Prism.js Syntax Highlighting Works

1. Prism.js CSS and JS were added to wwwroot and referenced in the layout.

2. A small JS function prismHighlightAll was created to call Prism.highlightAll().

3. The Blazor page calls this JS function after every render to ensure code blocks are highlighted, even after tab changes.

4. Code samples are wrapped in <pre><code class=\"language-xxx\">...</code></pre> blocks for Prism.js to style.

Sample usage:

<pre>
  <code class="language-csharp">
public class HelloWorld
{
    public static void Main()
    {
        Console.WriteLine("Hello, World!");
    }
}
  </code>
</pre>

References

For more detailed information and advanced scenarios, check out these helpful resources:

Prism.js Website

Official Prism.js documentation and downloads.

Prism.js Themes on GitHub

A collection of additional Prism.js themes.
An unhandled error has occurred. Reload 🗙