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. 一起入门Python2之python的安装及初识

    鉴于论坛需要持续更新文章才能更好的保证论坛的访问量和质量,以及论坛的发展.承蒙前辈的信任和支持,我就教大家python第二课,教的不好请多担待和指正. 我们先讲python的安装方法: 方法链接:ht ...

  2. Java Utils工具类大全

    源码和jar见:https://github.com/evil0ps/utils #Java Utils --- 封装了一些常用Java操作方法,便于重复开发利用. 另外希望身为Java牛牛的你们一起 ...

  3. ANSI转义序列

    http://ascii-table.com/ansi-escape-sequences.php 制作控制台程序时, 要实现一些特殊效果, 需要了解一下 [ANSI转义序列] . ANSI转义序列是一 ...

  4. antd 用 customize-cra 方式引入 sass

    antd 用 customize-cra 方式引入 sass 只需要安装:node-sass 即可

  5. 复习sql server 2000 MSDE2000 ，安装，打补丁，开1433端口。

    前言: 由于工作需要,一个仍在使用的古董软件需要安装配置. 原有系统是在主机部署,单机安装sql2000,其他机器(分机)也单机部署软件,部署sql2000,通过dtsrun /f sync.dts( ...

  6. Spring Boot系列之-profile

    Spring Boot profile用于分离不同环境的参数配置,通过spring.profile.active参数设置使用指定的profile. 在Spring Boot中应用程序配置可以使用2种格 ...

  7. 《MySQL必知必会》学习笔记——附录B 样例表

    附录B 样例表 本附录简要描述本书中所用的表及它们的用途. 编写SQL语句需要对基础数据库的设计有良好的理解.不知道什么信息存储在什么表中,表之间如何关联以及行内数据如何分解,是不可能编写出高效的SQ ...

  8. 【Leetcode_easy】1051. Height Checker

    problem 1051. Height Checker solution class Solution { public: int heightChecker(vector<int>&a ...

  9. mysql函数IFNULL的使用替换递归方法

    在电商行业经常遇到的问题就是类目与类目以及类目与商品的关系. 如果要查询一级类目下的所有商品 常规做法是先查询该一级类目下所有的二级类目,再由二级类目查询所有的三级类目,直到最后一级,再查询出对应的商 ...

  10. jpa序号/数字占位符?1/?2

    这里的入参nodeId对应占位符?1,入参severity对应?2:缺点是,序号必须是顺序的,按参数顺序严格对应 @Modifying @Transactional @Query(value = &q ...