如何在Tailwind CSS中自定义带有删除线的文本修饰的颜色

Question

如何在Tailwind CSS中自定义带有删除线的文本修饰的颜色

7

我想将"line-through"的线条宽度定制为4-6像素。我已经在tailwind.config.js中定制了粗线"line-through"，但是没有效果，也许你能给我关于我的问题的建议。

//setting tailwind.config.js in plugin:[]    
function ({addUtilities}) {
      const extendLineThrough = {
          '.line-through': {
              'textDecoration': 'line-through',
              'text-decoration-color': 'red',
              'text-decoration-width': '4px'
          },
      }
      addUtilities(extendLineThrough)
 }

<div class="hidden sm:block md:col-span-2 text-rigt">
  <p class="md:pt-1 text-gray-500 line-through">
    Rp. 8000
  </p>
</div>

- Anjasmara Dwi.S

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- JHeth · Accepted Answer

正确的CSS属性是text-decoration-thickness，因此您的插件应该是：

function ({addUtilities}) {
  const extendLineThrough = {
      '.line-through': {
          'textDecoration': 'line-through',
          'text-decoration-color': 'red',
          'text-decoration-thickness': '4px'
      },
  }
  addUtilities(extendLineThrough)
}

这里有一个在Tailwind Play上运行的可用版本。