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

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

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

解决方案：

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

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

3. 写一个新的style标签（注意不要scoped），在新的标签里去修改样式

关于Vue-ElementUI修改默认样式不成功问题解决的更多相关文章

  1. Vue使用Elementui修改默认最快方法！

    相信大家都需要过,在Vue中使用Elementui的时候,遇到最多也最蛋疼的问题就是修改默认样式,接下来直奔主题: // template <el-progress :text-inside=& ...

  2. Vue——解决使用第三方组件库时无法修改默认样式的问题（使用 /deep/ ）

    最近在开发一个基于Vue的后台管理系统,其中使用了element-ui第三方ui组件库.使用过组件库的人都知道,第三方组件往往会有一些默认的样式,而有些又是我们想要改变的. 一.基础(了解 <s ...

  3. ThinkPHP5如何修改默认跳转成功和失败页面

    ThinkPHP5如何修改默认跳转成功和失败页面 一.总结 一句话总结:直接修改默认跳转页面对应的模板文件的路径:'dispatch_success_tmpl' => APP_PATH . 'i ...

  4. Vue+element-ui 重置组件样式的写法

    两种方式实现element-ui组件的样式 方案1:重置的公共组件样式的写法如下 然后在main.js中引入 import '@/assets/css/element.css'   方案2:每个.vu ...

  5. element ui 修改默认样式

    修改element ui默认的样式 如果要组件内全局修改 首先在浏览器里F12找到element默认的UI类名 找到要修改的默认类名以后 在文件中修改代码,重写属性 <style> .el ...

  6. vue中修改swiper样式

    问题 vue单文件组件中无法修改swiper样式. 解决 1,单文件组件中:新增一个style 不加scoped 让它最终成为全局样式.只在其中操作swiper的样式. <style lang= ...

  7. Vue Element-ui自定义dialog样式

    第一步:定义 自定义dialog class名 第二步:全局修改自定义样式 自定义dialogStyle有三个儿子,这样只用找到他们就可以自定更改啦 .custonStyle { xxxxx } .c ...

  8. echarts legend 限制规定显示个数，显示省略号，修改默认样式

    类似百度统计,有的时候legend的个数比较多,但是前端需要控制初始化显示的个数,以及最多显示的条数,先看效果图: 先给代码: <!DOCTYPE html> <html lang= ...

  9. element-ui修改全局样式且只作用于当前页面

    1)修改组件的样式,但是只作用于当前页面,其他页面不受影响,做法有两种: 法一:使用关键字“/deep/” 1)在当前页面添加样式: <style lang="scss" s ...

随机推荐

  1. flutte的第一个hello world程序

    用命令行创建项目: flutter create flutterdemo VSCode或者AS连接手机后 输入 flutter run 编译后就可以将默认的代码显示在手机上了 开始写hello wor ...

  2. VS2015 dlib编译 x64 Release .lib生成

    VS2015 dlib编译 x64 Release >------ 已启动生成: 项目: ZERO_CHECK, 配置: Release x64 ------ > Checking Bui ...

  3. 迅速解决！！！！！启动Tomcat报错PermGen space

    启动Tomcat报错   PermGen space    内存溢出 解决方法:扩大tomcat内存 修改参数:set JAVA_OPTS=-Xms1024m -Xmx1024m -XX:PermSi ...

  4. Spring MVC初始化

      整个Spring MVC的初始化,配置了DispatcherServlet和ContextLoaderListener,那么它们是如何初始化Spring IoC容器上下文和映射请求上下文的呢?所以 ...

  5. k8s版jenkins--master/slave模式实现CI/CD---带solo开源博客项目--带maven、djk、git工具

    k8s环境: 192.168.0.91 master 192.168.0.92 node 192.168.0.96 gitlab 192.168.0.98 harbor k8s集群安装请参照:http ...

  6. MySQL之忘记root重置方法

    参考:https://help.aliyun.com/knowledge_detail/42520.html MySQL忘记了root登录密码需要重置 1,修改配置文件 一般配置文件路径为/etc/m ...

  7. console.log()和alert()的区别

    一直都是知道console.log()和alert()是有区别的,但是具体有什么区别就不清楚了,后来在权威指南里注意到了说alert()具有侵入性才来查一查两者的具体区别. 查询到的区别: alert ...

  8. TCP/IP学习笔记6--TCP/IP模型

    "五月的风慢慢地吹过湖面,泛起波浪层层,一只鸟儿飞过来,在我面前婉转歌唱" TCP/IP是当今计算机网络世界使用最为广泛的协议.该方面的知识对于那些想做网络编程的人来说是只至关重要 ...

  9. Git使用总结（二）：分支管理

    1.创建分支 a.直接创建 git branch dev(分支名) b.基于某个历史版本创建分支 git branch dev HEAD 2.查看分支 git branch -av 3.删除分支 gi ...

  10. python — 线程

    目录 1.线程基础知识 2 Thread 类 3 锁 4 队列 1.线程基础知识 1.1 进程与线程的区别 进程: 创建进程 时间开销大 销毁进程 时间开销大 进程之间切换 时间开销大 线程: 线程是 ...