到目前为止，使用 Tailwind 样式化文章、文档或博客帖子一直是一项繁琐的任务，这需要对排版有敏锐的眼光和大量复杂的自定义 CSS。
默认情况下，Tailwind 会移除段落、标题、列表等的所有默认浏览器样式。这在构建应用程序用户界面时非常有用，因为您花费更少的时间来撤销用户代理样式，但当您_确实_只是想要样式化一些来自 CMS 或 markdown 文件的富文本编辑器的内容时，这可能会令人惊讶和不直观。
实际上我们收到了很多关于它的投诉，人们经常问我们这样的问题：
为什么 Tailwind 移除了我的
h1元素的默认样式？我该如何禁用这个？你是什么意思，我也失去了其他所有基础样式？
我们听到了您的声音，但我们不认为简单地禁用我们的基础样式是您真的想要的。您不想在仪表板 UI 的每个 p 元素中都要去除恼人的边距。我怀疑您真的希望您的博客文章使用用户代理样式 — 您想让它们看起来_棒极了_，而不是糟糕。
这就是为什么今天我们很高兴地发布 @tailwindcss/typography — 一个插件，可以为您提供您_真正_想要的，而不需要做一些愚蠢的事情，比如禁用我们的基础样式。
它添加了一组新的 prose 类，您可以将其应用于任何一块普通的 HTML 内容， 将其变成一个美丽、格式良好的文档：
<article class="prose lg:prose-xl"> <h1>奶酪蒜蓉面包：科学告诉我们的事</h1> <p> 多年来，父母一直向他们的孩子倡导食用奶酪蒜蓉面包的健康益处，这种食物在我们的文化中获得了如此标志性的地位，以至于孩子们常常在万圣节装扮成热乎乎、奶酪味浓的面包。 </p> <p> 但最近的一项研究表明，这道备受推崇的开胃菜可能与全国范围内出现的一系列狂犬病病例有关。 </p> <!-- ... --></article>那么它实际上看起来是什么样的呢？好吧，您现在正在查看它 — 我们用它来样式化这篇博客的内容！
查看文档 以了解更多信息并今天就试试。
想谈谈这篇文章吗？ 在 GitHub 上讨论 →