微信公众号 HTML 排版助手

要解决的问题

微信公众号编辑器会剥离或变形一部分 HTML/CSS：外链样式、Flex/Grid、伪元素、渐变、浮动、部分 table 默认边框都会出现。直接给公众号生成网页 HTML，经常会在手机端断行、出现白线、代码挤成一行。

技能如何工作

这个技能把微信公众号的排版限制整理成一套可执行的生成规则：

• 样式全部内联：避免 class、外部样式表，使用 style=""。
• 组件模板化：引言框、数据卡片、暗色重点框、色块提示框都有固定结构。
• 规避微信兼容坑：暗色容器内不嵌套 table，标签组件用 span，流程图垂直排列，代码块逐行 <br> 并用   保留缩进。
• 排版参数固定：正文 15px、行高 2，小标题 17px，章节标题 20px，整体容器 max-width:680px。

适用边界

它适合把文章、技术笔记、图文内容转成公众号可粘贴 HTML，不适合生成依赖现代 CSS 布局的网页或小程序页面。使用素材时仍需遵守微信素材库与外链限制。