应使用 嵌套而非单独 或 ： 用于单个标识符， 用于多行代码，且 language-xxx 类必须加在 上以确保高亮与可访问性。
什么时候该用 而不是 <pre class="brush:php;toolbar:false;">
<code> 是行内语义标签，只包裹一小段代码（比如函数名、变量名或命令），不保留换行和多余空格；<code><pre class="brush:php;toolbar:false;"></pre> 是块级容器，会原样保留所有空白符和换行，适合多行代码块。
常见错误是把整段 Python 脚本塞进 <code> 里——结果缩进全塌了，还可能被浏览器折行打断逻辑。
实操建议：
• 单个标识符（如 console.log、useState）用 <code>
• 多行代码（含缩进、空行）必须套 <pre class="brush:php;toolbar:false;"><code></code> 组合<br>• 不要单独用 <code><pre class="brush:php;toolbar:false;"></pre> 包代码——缺少语义，可访问性和 SEO 都弱
<pre class="brush:php;toolbar:false;"><code></code> 嵌套才是标准写法</pre>
W3C 明确推荐 <pre class="brush:php;toolbar:false;"><code></code> 嵌套，而非仅用 <code><pre class="brush:php;toolbar:false;"></pre>。
原因有三：
• <code> 告诉屏幕阅读器“这是计算机代码”，提升可访问性
• 语法高亮工具（如 Prism.js、highlight.js）默认识别 <pre class="brush:php;toolbar:false;"><code></code> 结构<br>• CSS 选择器更精准，例如 <code>pre code { font-family: monospace; }</code> 可避免误样式化其他 <code><pre class="brush:php;toolbar:false;"></pre> 内容（如诗歌、日志）
注意：不要写成 <code><pre class="brush:php;toolbar:false;"></pre> —— 顺序反了，HTML 解析会自动修正，但语义丢失
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
空格、缩进和换行在 <pre class="brush:php;toolbar:false;"></pre> 里怎么控制
<pre class="brush:php;toolbar:false;"></pre> 的核心行为是“照搬源码中的空白”，但这常导致意外问题：
• 模板中缩进的 HTML 本身会被渲染为额外空格
• 代码块首尾多出空行，影响排版
解决方法：
• 把 <code> 标签紧贴 <pre class="brush:php;toolbar:false;"></pre> 开闭标签写，不留换行：
<pre class="brush:php;toolbar:false;"><code class="js">function hello() {<br> return "world";<br>}</code>
• 用 CSS 控制溢出：
pre { overflow-x: auto; white-space: pre; }，防止长行撑破容器• 若需去掉首尾空行，JS 中可 trim 后再插入，但更推荐模板阶段清理
为什么 class="xxx" 放在 <code> 上而不是 <pre class="brush:php;toolbar:false;"></pre>
语法高亮库（如 highlight.js）默认从 <code> 元素上读取 class 属性来判断语言类型，例如 class="python" 或 class="lang-js"。
如果写在 <pre class="brush:php;toolbar:false;"></pre> 上，多数高亮器直接忽略，回退到自动检测——容易误判，尤其对 shell 命令或 JSON 这类无关键字特征的内容。
实操要点：
• 语言标识必须加在 <code> 标签上
• 推荐用 language- 前缀（兼容性最好）
• 不要依赖 <pre class="brush:php;toolbar:false;"></pre> 的 class 控制高亮，那是给布局或主题用的
真正容易被忽略的是：很多静态站点生成器（如 Hugo、Jekyll）的代码块语法糖（如 {% highlight python %}）底层仍输出 <pre class="brush:php;toolbar:false;"><code></code>，但若模板配置漏了 language class，或插件版本旧，高亮就静默失效——这时候得查 DOM 里 <code><code></code> 元素有没有那个 class，而不是只看渲染效果。</code></pre>
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
