vue 单文件 样式写了scoped 不能覆盖框架原有样式的解决办法

在vue 里面<style scoped></style> 是为了让样式只影响本身自己组件的样式，不改变全局的样式。

但是存在一个问题组件框架的ui样式没办法覆盖。

解决办法：在vue 文件里面写两个style 样式

例如

<style>

  ///全局的

//全局的这个一定要在要覆盖的ui样式之前，在包裹上一层，这样就不会影响别的组件的样式

</style>

<style scoped>

//私有的

</style>

全局和私有的style 的顺序一定不能变，全局的在最前面，私有的在后面

vue 单文件 样式写了scoped 不能覆盖框架原有样式的解决办法的更多相关文章

  1. 如何手动解析vue单文件并预览？

    开头 笔者之前的文章里介绍过一个代码在线编辑预览工具的实现(传送门:快速搭建一个代码在线编辑预览工具),实现了css.html.js的编辑,但是对于demo场景来说,vue单文件也是一个比较好的代码组 ...

  2. webpack入坑之旅（五）加载vue单文件组件

    这是一系列文章,此系列所有的练习都存在了我的github仓库中vue-webpack,在本人有了新的理解与认识之后,会对文章有不定时的更正与更新.下面是目前完成的列表: webpack入坑之旅(一)不 ...

  3. vue 单文件组件

    在很多vue项目中,我们使用vue.component来定义全局组件,紧接着用new Vue({el:'#container'})在每个页面内指定一个容器元素 这种方式在很多中小规模的项目中运作的很好 ...

  4. Vue单文件组件

    前面的话 本文将详细介绍Vue单文件组件 概述 在很多 Vue 项目中,使用 Vue.component 来定义全局组件,紧接着用 new Vue({ el: '#container '}) 在每个页 ...

  5. VUE2 第六天学习--- vue单文件项目构建

    阅读目录 VUE2 第六天学习--- vue单文件项目构建 回到顶部 VUE2 第六天学习--- vue单文件项目构建 VUE单文件组件在Vue项目中,然后使用 new Vue({el: '#cont ...

  6. vue单文件中引用路径的处理

    原文地址:vue单文件中引用路径的处理如有错误,欢迎指正! vue单文件的开发过程中,在单文件模版中可能会涉及到文件路径的处理,比如 <img>, style 中的 background ...

  7. webpack打包vue单文件组件

    一.vue单文件组件 ①文件扩展名为 .vue 的 就是single-file components(单文件组件) ②参考文档:单文件组件 二.webpack加载第三方包 ①项目中,如果需要用到一些第 ...

  8. 基于VSCode的vue单文件组件模板设置---一次设置，可爽终生

    第一步: 第二步: 第三步: 打开vue.json文件后,如果是初次设置,应该如下图所示,绿色注释部分不用管,注意那两个白色大括号 第四步:在大括号内全部粘贴如下代码,保存即可完成vue模板的设置 & ...

  9. ts-loader如何与vue单文件组件衔接

    .ts-loader是如何与vue单文件组件衔接作用的 https://github.com/microsoft/TypeScript-Vue-Starter https://www.npmjs.co ...

随机推荐

  1. DataStream_操作基本类型数据的流对象

    import java.io.DataInputStream; import java.io.DataOutputStream; import java.io.FileInputStream; imp ...

  2. C# X509Certificate类 调用证书

    一.命名空间 using System.Security.Cryptography.X509Certificates; 二.调用代码 string certPath = Server.MapPath( ...

  3. （3）HomeAssistant 连接MQTT

    整体说明 1 自己在阿里云上搭建MQTT服务器 2 自己笔记本电脑windos10搭建HASS,配置参数连接阿里云服务器 3 手机下载MQTT调试助手,当测试端 4手机当终端---阿里云MQTT--- ...

  4. python 上传百度语音识别+文字返回结果

    1文字生成语音 #!/usr/bin/python3 import urllib.request import requests#导入requests库 import urllib import js ...

  5. 如何在自己设计的页面中调用metamask-1

    启发: https://github.com/MetaMask/metamask-extension/issues/714 https://github.com/MetaMask/metamask-e ...

  6. python基础学习第五天

    li=[1,2,33,-1,'dbssd',[4,5,6],{4:'rfw',5:'re'}]del(li[1])print(li)print(type(li))#访问元素print(li[0])pr ...

  7. Android学习之AndroidStudio新建工程报Open File报错处理

    在AndroidStudio中新建一个工程,报如下错误: 错误处理: 1.找到build.grandle(Module:app) 2.打开build.gradle(Module:app)文件如下图所示 ...

  8. 常用gcc选项

    <Linux GCC常用命令> Makefile有三个非常有用的变量.分别是$@,$^,$<代表的意义分别是: $@--目标文件,$^--所有的依赖文件,$<--第一个依赖文件 ...

  9. Linux系列教程（五）——Linux常用命令之链接命令和权限管理命令

    前一篇博客我们讲解了Linux文件和目录处理命令,还是老生常淡,对于新手而言,我们不需要完全记住命令的详细语法,记住该命令能完成什么功能,然后需要的时候去查就好了,用的多了我们就自然记住了.这篇博客我 ...

  10. SQL Server 中用DBCC Opentran语句查看未关闭的事务（转载）

    从SQL Server 2008开始,可以使用DBCC Opentran语句查看数据库中最早一个没有被关闭的事务,下面这篇文章讲述了如何使用DBCC Opentran语句. An Open trans ...