顺风CSS:动态创建HTML样式

Question

有谁想出了用尾风CSS设计自动生成的HTML代码的好方法吗？

示例:使用像Marked这样的库将Markdown转换为HTML，然后将其注入页面。

这里的关键是，您不知道自动生成的HTML的结构，因为标记可以是作者创建的任何格式。

Answer 1

您唯一能做的就是像样式一样，通过javascript添加一个类型的所有元素，比如：

document.querySelectorAll('span').classList.add('text-sm text-gray-500 py-1');

等

Answer 2

npm install @tailwindcss/typography

配置tailwind.config.js插件：

plugins: [
    require("@tailwindcss/typography")
  ],

在一个特殊的className组件中使用它

  <article className="prose lg:prose-xl">
        <div dangerouslySetInnerHTML={{ __html: dynamicContentHere }} />
      </article>