WordPress如何查看HTML5代码？

<div class="method-card">
  <h3>▌方法二：开发者工具深度分析（开发者首选）</h3>
  <div class="steps">
    <p><strong>操作路径：</strong> 按<kbd>F12</kbd>或<kbd>Ctrl+Shift+I</kbd>打开控制台</p>
    <p><strong>高阶应用：</strong></p>
    <ul>
      <li>在<b>Elements</b>面板实时查看DOM树形结构</li>
      <li>右键点击页面元素 → 选择<b>“检查”</b>精确定位代码</li>
      <li>通过<code>Console</code>输入<code>document.doctype.name</code>验证文档类型</li>
    </ul>
    <div class="tip-box">
       专业技巧：开启<em>移动端模拟模式</em>（<kbd>Ctrl+Shift+M</kbd>），测试HTML5在响应式布局中的表现
    </div>
  </div>
</div>
<div class="method-card">
  <h3>▌方法三：WordPress后台直接查看</h3>
  <div class="steps">
    <p><strong>古腾堡编辑器：</strong></p>
    <ul>
      <li>编辑文章/页面时点击右上角<b>⋮</b>菜单</li>
      <li>选择<b>“代码编辑器”</b>查看原始HTML</li>
    </ul>
    <p><strong>经典编辑器：</strong></p>
    <ul>
      <li>切换<b>“文本”</b>标签页查看源码</li>
    </ul>
    <div class="warning-box">
      ️ 警告：直接修改编辑器代码可能导致布局错乱，修改前务必备份
    </div>
  </div>
</div>