How to change element top border color in component through props using Tailwind CSS

Question

我试图通过将颜色值作为道具传递给组件来更改顶部边框的颜色，但它没有任何效果。

我正在寻找解决方案。请帮助我！

export default function TargetsProgressInfo(props) {
    return (

            <ul>
                <span className={` after:border-[7px] after:w-4 ${props.colorTip} after:border-b-transparent`}></span></li>
            </ul>
        </div >

    )
}


**home.jsx**

<TargetsProgressInfo colorTip="after-border-t-red-600"/>

Answer 1

解决方案是将 Tailwind CSS 的全名作为 props 传递

        <TargetsProgressInfo colorTip="after:border-t-red-600"/>