vue引用第三方组件覆盖原有样式
问题通过全局样式或者去掉父组件scope方式修改子组件样式不生效解决方式1.引入的样式文件格式不争取,例如stylus、scss等,而不是统一以.css为后缀的文件2.去掉scope 在父组件style内修改样式,使用!important 提权,优先使用该样式通常做法局部引入在各自vue文件中使用,互不干扰style标签里面的 关键字scoped【限位标...
·
问题
通过全局样式或者去掉父组件中用scope方式声明样式,修改子组件样式不生效
解决方式
1.引入的样式文件格式不正确,例如stylus、scss等,而不是统一以.css为后缀的文件
2.在vue文件内样式域去掉scope, 在父组件style内修改样式,使用!important 提权,优先使用该样式
通常做法
-
局部引入
在各自vue文件中使用,互不干扰
style标签里面的 关键字scoped【限位标记】
添加这个关键字的作用:将这个style里面的样式都限制在该组件中,不会影响其他的组件。 -
全局引入:
作用于全局,让很多内容都使用这个样式,这个就要回到App.vue中
(1)建立自己专门存放自定义样式的css文件
(2)在App.vue中新建<style></style>
(3)将css文件通过import ‘css文件位置’ 引入到style标签中,作为全局样式覆盖
更多推荐
已为社区贡献2条内容
所有评论(0)