正确代码高亮需用 嵌套结构，类名须为 language-xxx 或 lang-xxx 格式，html字符需转义，配合 highlight.js 或 prism.js 自动生效。
用 `
` 和 `<pre class="brush:php;toolbar:false;">` 结合实现带语法高亮的代码展示，关键不在标签本身（它们只负责结构和语义），而在于配合高亮库自动识别并着色。只要结构写对、类名规范、资源加载到位，高亮就能生效。 <h3>必须用 `<pre class="brush:php;toolbar:false;"><code>` 嵌套结构</code>
单独 `` 或 `<pre class="brush:php;toolbar:false;">` 都不行——`<pre class="brush:php;toolbar:false;">` 保证换行缩进不丢失，`<code>` 表明这是计算机代码，二者嵌套是 highlight.js 和 Prism.js 的硬性约定。</code></pre></pre>
- ✅ 正确：
<pre class="brush:php;toolbar:false;"><code class="html"><div>Hello</div></code></pre> - ❌ 错误：
<p><code><div>（不会触发高亮） - ⚠️ 注意：HTML 特殊字符必须转义，比如 `<，`>` 写成
>，否则浏览器会尝试解析为标签
语言标识要写对 class 名
高亮库靠 `class` 属性判断语言类型，必须是 language-xxx 或 lang-xxx 格式，且值要准确。
- 支持的写法：
class="js"、class="lang-css"、class="python" - 不识别的写法：
class="js"、class="javascript"、class="html5" - HTML 示例：
<code class="html"><header><h1>Title</h1></header>
引入高亮库并确保执行时机正确
推荐用 CDN 引入 highlight.js（最轻量）或 Prism.js（插件丰富），但要注意加载顺序和初始化方式。
- highlight.js：引入 CSS + JS 后，调用
hljs.highlightAll()（放在
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
