在使用el-form组件时,组件中的字体是黑色的,需要显示白色字体就加了个color:#fff,结果发现修改并没有什么效果:还是原来的黑色
打开F12发现属于.el-form-item__label选择器下面的,我就在css下面修改了该选择器,但仍然没有效果,但是在浏览器中取消color选项是有效果的:
左图是取消color前,右图是取消后;
既然取消color选择可以修改样式但为什么我的修改不生效呢?是因为在style里面有一个属性scoped,该属性作用是实现组件的私有化,不对全局造成样式污染,表示当前style属性只属于当前模块,通俗点来讲就是样式仅仅应用到 style 元素的父元素及其子元素。当我把这个属性取消掉就会应该用到我自己设置的颜色了。
我做的那一块把表单封装了,所以就直接取消了scoped属性,但其实这样做法或许并不可取,上面也说了,可能会影响到全局的样式。资历尚浅,希望大佬指教。
比较好的做法就是,使用el-input的时候添加一个样式类来覆盖el的样式。
使用 >>> 和/deep/都可以来覆盖官方的样式。
element样式无法修改
最新推荐文章于 2024-07-24 15:50:53 发布