SyntaxHighlighter 开源项目教程

最新推荐文章于 2024-09-01 08:41:36 发布

凌崧铖

最新推荐文章于 2024-09-01 08:41:36 发布

阅读量408

点赞数 3

本文链接：https://blog.csdn.net/gitblog_00767/article/details/141083687

版权

SyntaxHighlighter 开源项目教程

syntaxhighlighterSyntaxHighlighter is a fully functional self-contained code syntax highlighter developed in JavaScript.项目地址:https://gitcode.com/gh_mirrors/sy/syntaxhighlighter

项目介绍

SyntaxHighlighter 是一个完全基于 JavaScript 开发的代码语法高亮工具，自 2004 年起由 Alex Gorbatchev 开发并维护。该项目旨在为网页中的代码块提供美观且易于阅读的语法高亮显示，支持多种编程语言。SyntaxHighlighter 是一个自包含的工具，不需要任何外部依赖，适用于任何 HTML 页面。

项目快速启动

安装

首先，你需要从 GitHub 仓库克隆或下载 SyntaxHighlighter 项目：

git clone https://github.com/syntaxhighlighter/syntaxhighlighter.git

引入必要的文件

在你的 HTML 文件中引入 SyntaxHighlighter 的核心脚本和主题样式：

<!DOCTYPE html>
<html>
<head>
    <link href="path/to/syntaxhighlighter/styles/shCore.css" rel="stylesheet" type="text/css" />
    <link href="path/to/syntaxhighlighter/styles/shThemeDefault.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <pre class="brush: js;">
        // 这里是你的代码
        function helloWorld() {
            console.log('Hello, world!');
        }
    </pre>

    <script src="path/to/syntaxhighlighter/scripts/shCore.js"></script>
    <script src="path/to/syntaxhighlighter/scripts/shBrushJScript.js"></script>
    <script>
        SyntaxHighlighter.all();
    </script>
</body>
</html>