项目中如何修改element-ui的默认样式

项目中如何修改element-ui的默认样式?

  • 原因是因为我们在使用vue编写css样式时,会在style添加scoped属性

  • 添加了scoped的组件无法修改的样式,去掉scoped就可以了。

  • vue中的scoped属性的效果主要通过PostCSS转译实现,

注明: PostCSS是一个用 JavaScript 工具和插件转换 CSS 代码的工具

那么有没有办法在不改变原来写好的css样式的情况,修改默认的element-ui样式呢?

解决方法
  1. 在样式外新增一个样式不添加scoped


缺点:这样设置的是全局样式,意思就是如果你的项目里面有多个css需要修改,那么这么设置,两个地方都会被改变。

  1. 使用deep样式穿透

3 使用>>>穿透


缺点:有时候sass会不识别,从而不起效果。

4 有些样式是行内样式权重比较高则需要使用上面的几种方法来保证可以修改样式并且添加上!important来增加权重



你可能感兴趣的:(面试题,js)