环境:
tailwind + element plus
问题
el-button在没有设置plain的情况下背景透明了,文字颜色也不对
原因
打开f12查看按钮样式,发现是被tailwind的样式覆盖了,tailwind采用的是属性选择器的方式来设置样式
解决办法
- 在tailwind.config.cjs中关闭默认样式
module.exports = {
...
corePlugins: {
preflight: false, // 关闭默认样式
}
}
- 去node_modules里找到tailwindcss,把preflight.css拷贝一份放在项目中公共样式文件夹下,然后把影响到button的部分注释掉
- 在main.js中引入preflight.css