标签无内置样式，仅具语义；align属性在html5中被废弃，须用css实现居中；表强重要性（含可访问性），仅视觉加粗；保留格式但需防溢出，排版核心是语义与响应式逻辑。
<p></p> 标签本身不带样式，它只定义段落语义；浏览器默认给它加了上下外边距（margin），但字体、颜色、对齐等完全依赖 CSS 或过时的 align 属性——而后者在 HTML5 中已被废弃，强行用会触发验证警告，且现代浏览器可能忽略。
为什么 align 属性失效了
HTML5 明确移除了 <p align="center"></p> 这类内联呈现属性。它不是“偶尔不工作”，而是被规范弃用：
- align 不再是 <p></p> 的合法属性，W3C 验证器会报错
- Chrome/Firefox/Edge 等主流浏览器已停止支持该属性的渲染逻辑（部分旧版可能兼容，但不可靠）
- 即使页面看起来“还居中”，那很可能是 CSS 重置或用户代理样式表在兜底，不是 align 在起作用
替代方案只有 CSS：text-align: center 控制文字对齐，margin: 0 auto 配合 width 才能真正居中整个段落块（需注意 <p></p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill4293" title="Doc To HTML"><img
src="https://img.php.cn/upload/skill/000/000/081/178998486916110.jpg" alt="Doc To HTML" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill4293" title="Doc To HTML" class="overflowclass">Doc To HTML</a>
<p class="overflowclass">使用 MinerU 文档处理引擎将 Word 文档（.doc、.docx）转换为保留结构和格式的干净 HTML。</p>
</div>
<a rel="nofollow" href="/xiazai/skill4293" title="Doc To HTML" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div> 默认是 display: block）。
<strong></strong> 和 <b></b> 的区别不止是粗体
两者都渲染为粗体，但语义和可访问性影响完全不同：
- <strong></strong> 表示内容有强重要性，屏幕阅读器会加重语气朗读，SEO 也更倾向识别其语义权重
- <b></b> 仅表示“视觉上不同”，无语义强调，适合如产品名、关键词、翻译中的原文等中性突出场景
- 滥用 <b></b> 替代 <strong></strong> 会让视障用户错过关键提示（比如“<strong>密码错误</strong>”比“<code><b>密码错误</b>”更能传达严重性）
同理：<em></em>（强调，斜体+语义） ≠ <i></i>（斜体，仅样式，适合外文、术语、船名等）。
<pre class="brush:php;toolbar:false;"></pre> 保留空格和换行，但别直接塞大段文本
<pre class="brush:php;toolbar:false;"></pre> 的核心价值是“原样输出”，包括缩进、多空格、回车——但它默认用等宽字体、无换行（white-space: pre），容易撑破容器：
- 长代码行不会自动折行，需配合 CSS：
white-space: pre-wrap或overflow-x: auto - 嵌套在响应式布局里时，
<pre class="brush:php;toolbar:false;"></pre>容易横向溢出，建议外层加<div style="overflow-x: auto"> <li>不要用 <code><pre class="brush:php;toolbar:false;"></pre>来“假装做排版”，比如用空格对齐中文——它破坏可访问性（屏幕阅读器逐字读空格），也难维护
示例安全写法：
<pre class="brush:php;toolbar:false;" style="white-space: pre-wrap; background: #f5f5f5; padding: 1em;">function hello() { console.log("world");}真正容易被忽略的点是：段落结构不是靠视觉对齐维持的，而是靠语义标签嵌套和 CSS 逻辑控制。一个居中的 <p></p> 如果没设 max-width，在超宽屏上会拉得极长，可读性反而崩坏——排版的终点从来不是“看起来像设计稿”，而是“在任意设备上都保持信息有效传达”。
