如何让Tailwind中ul/ol列表恢复默认样式（含嵌套列表）？

Tailwind的Preflight默认重置不仅移除了列表的项目符号，还清除了列表的内外边距及嵌套层级样式，仅用list-style: revert无法完全恢复嵌套列表的正常结构。你可以修改application.tailwind.css中的代码，补充必要的边距和嵌套层级样式：

@layer base {
  ul, ol {
    list-style: revert;
    margin: revert;
    padding-left: revert;
  }

  ul ul, ul ol, ol ul, ol ol {
    margin-left: revert;
    padding-left: revert;
  }
}

关键说明 #

• margin: revert和padding-left: revert：恢复列表默认的外边距与左侧内边距，确保项目符号能正确显示并与文本保持合理间距
• 针对嵌套列表的样式设置：避免子列表被Preflight的全局重置覆盖，保证嵌套层级的缩进和结构正常

添加代码后，嵌套列表将恢复为预期的层级结构：

• item1
  • item2
• item3

内容的提问来源于stack exchange，提问作者Corey