自定义Tailwind Typography的blockquote样式以移除闭合引号：可通过tailwind.config.js配置还是需用CSS加!important覆盖？

好问题！在Tailwind Typography里去掉blockquote的闭合引号完全不需要用!important，有两种优雅的方法可以实现，推荐优先用配置扩展的方式：

方法一：通过tailwind.config.js配置（推荐） #

Tailwind Typography插件允许你在配置文件中扩展或覆盖默认的排版样式，这样能保持代码的一致性，符合Tailwind的配置式工作流。你只需要在theme.extend.typography里针对blockquote的:after伪元素修改content属性为none即可：

/** @type {import('tailwindcss').Config} */
module.exports = {
  theme: {
    extend: {
      typography: ({ theme }) => ({
        DEFAULT: {
          css: {
            blockquote: {
              '&:after': {
                content: 'none', // 移除闭合引号
              },
              // 如果需要调整起始引号的样式，也可以在这里修改&:before
            },
          },
        },
      }),
    },
  },
  plugins: [require('@tailwindcss/typography')],
};

这个方法的优先级高于插件的默认样式，所以不需要额外的权重声明就能生效。

方法二：使用自定义CSS（无需!important） #

如果你更倾向于用纯CSS来修改，也可以在全局样式文件（比如styles.css）中添加以下代码：

.prose blockquote:after {
  content: none;
}

因为.prose是Tailwind Typography的默认容器类，这个选择器的权重和插件自带的样式权重一致，只要你的自定义CSS放在Tailwind样式之后加载，就会自动覆盖默认样式，完全不需要!important。

总结 #

两种方法都能实现需求，优先推荐第一种配置式的方法，更贴合Tailwind的设计理念；如果有特殊场景需要单独调整，第二种纯CSS的方式也足够优雅，不需要依赖!important这种hack手段。

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