关于Vue-ElementUI修改默认样式不成功问题解决

Element是一个很好用的组件库,但是有时候我们需要修改一些组件的样式以满足我们自己的需求。

我们用浏览器调试找到相应的class,在本地重写这个class时,发现修改不成功。

这是因为在Vue文件中的style标签上有一个特殊的属性:scoped。当一个style有这个标签,它的样式就只能作用于当前的Vue组件,可以使组件的样式不相互污染。

解决方案:

  1. 去掉scoped,但此方法可能会造成全局污染

  2. 将修改的样式放在控制全局样式css文件中

  3. 写一个新的style标签(注意不要scoped),在新的标签里去修改样式

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • ## 框架和库的区别?> 框架(framework):一套完整的软件设计架构和**解决方案**。> > 库(lib...
    Rui_bdad阅读 8,175评论 1 4
  • title: 风格指南type: style-guide 这里是官方的 Vue 特有代码的风格指南。如果在工程中使...
    ChenyuMa阅读 4,808评论 1 1
  • 准备工作 一、安装脚手架 1、安装vue脚手架,这是构建vue项目的工具-g为全局安装​ npm insta...
    不困于情阅读 6,778评论 0 3
  • 第一章 Vue概述 what? Vue是实现UI层的渐进式js框架,核心库关注视图层,简单的ui构建,复杂的路由控...
    fastwe阅读 4,123评论 0 0
  • 本文章是我最近在公司的一场内部分享的内容。我有个习惯就是每次分享都会先将要分享的内容写成文章。所以这个文集也是用来...
    Awey阅读 13,132评论 4 67

友情链接更多精彩内容