图例 代码在图片后面 点赞❤️+关注🙏+收藏⭐️
源代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Highlight.js Demo</title>
<!-- 引入Highlight.js的CSS文件 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/github.min.css">
<!-- 引入Highlight.js的JS文件 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
<!-- 自动初始化所有代码块的高亮 -->
<script>hljs.highlightAll();</script>
</head>
<body>
<h1>Highlight.js 示例</h1>
<p>下面是一段Python代码:</p>
<pre><code class="python">
# 这是一个简单的Python函数
def hello_world():
print("Hello, world!")
</code></pre>
<p>下面是一段JavaScript代码:</p>
<pre><code class="javascript">
// 这是一个简单的JavaScript函数
function greet(name) {
console.log('Hello, ' + name + '!');
}
greet('John');
</code></pre>
<p>下面是一段HTML代码:</p>
<pre><code class="xml">
<!-- 这是一个简单的HTML结构 -->
<div>
<p>Hello, <strong>world</strong>!</p>
</div>
</code></pre>
</body>
</html>