关掉 coreplugins.preflight 并配合 .prose 容器内 all: revert 是恢复富文本默认样式的正确做法，需避开 img 和全局元素，手动补 box-sizing、img max-width 等关键规则。
关掉 corePlugins.preflight 是唯一能真正恢复富文本默认样式的做法，但不能直接全盘禁用——否则 ul/ol 缩进、img 布局、button 焦点等都会崩。必须配合精准覆盖，只还原富文本容器内需要的部分。
为什么富文本区域样式“突然消失”？
Preflight 不是漏写了样式，而是主动重置：它让 ul 的 padding-inline-start 变成 0、h1–h6 的 font-weight 和 font-size 全部 inherit、p 的 margin-block 归零。富文本（比如 Quill、Tiptap、CMS 输出的 HTML）依赖这些原生行为渲染层级和段落间距，一关就扁平化。
-
ul嵌套后缩进全无，项目符号还在但挤在左边缘 -
blockquote失去左右边框和内边距，看起来像普通段落 -
img默认变成display: block，但富文本里常需inline对齐文字 -
pre和code的字体、背景、换行被重置，代码块变样
只对富文本容器启用 revert，不污染全局
别在 @layer base 里全局写 ul, ol, p, h1, h2 {...} —— 这会把整个站点的标题、导航列表都拉回浏览器默认，破坏 UI 库一致性。应该限定作用域：
@layer base {
.prose ul,
.prose ol,
.prose p,
.prose h1,
.prose h2,
.prose h3,
.prose blockquote,
.prose pre,
.prose code {
all: revert;
}
}
-
all: revert在这里安全：它只作用于富文本容器内部，且现代浏览器（Chrome 87+ / Firefox 69+ / Safari 14.1+）已稳定支持 - 不用逐个写
margin: revert; padding: revert;，all: revert能同时还原display、font、line-height等富文本依赖的全部默认值 - 如果富文本用的是其他 class 名（如
.content、.markdown-body），把.prose换掉即可，不要加多余选择器层级 - 避免对
img用all: revert：它会把max-width: 100%也撤掉，导致图片撑破容器；单独补.prose img { max-width: 100%; height: auto; }
关 preflight 后必须手动补的关键规则
禁用 preflight 后，Tailwind 不再注入那批基础重置，但有些规则不是“可有可无”，而是布局基石：
- 必须保留
* { box-sizing: border-box; }，否则所有padding/border计算错乱，富文本里的卡片、引用块会溢出 - 必须显式加
img { max-width: 100%; height: auto; }，Preflight 原本就做了这事，关了就得自己补 - 若富文本含表格，加
.prose table { width: 100%; border-collapse: collapse; }，Preflight 不管table，但默认样式太丑 - 别补
all: revert到body或html：它会把font-family、line-height等全局设置也清空，UI 库字体立即失效
为什么 prefix 和 important 都救不了富文本？
prefix: 'tw-' 和 important: true 对富文本内容完全无效：
- 富文本 HTML 是运行时插入的字符串（如
innerHTML = '<p class="text-lg">...</p>'），里面写的class="text-lg"不是 Tailwind 生成的类，加前缀根本不管用 -
important: true只影响你手写的text-lg工具类，而富文本里的<h2></h2>、<ul></ul>是标签选择器，Preflight 的h2 { font-weight: inherit; }规则权重更高，!text-lg压不住 - 试图用
!prose类加!important？没这回事 ——prose是插件类，不带!修饰符，而且它本身也受 Preflight 标签规则压制
富文本样式问题本质是“浏览器默认行为被劫持”，解法只能是放行或还原，不是加权或改名。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
