美文网首页
更改element内部样式

更改element内部样式

作者: JadeTsujiSan | 来源:发表于2020-02-27 21:22 被阅读0次

最近用vue脚手架做个项目,由于用element框架,有些样式不是自己想要的,就要改内部样式,而我又用了scoped.

何为scoped?

在vue文件中的style标签上,有一个特殊的属性:scoped。当一个style标签拥有scoped属性时,它的CSS样式就只能作用于当前的组件,也就是说,该样式只能适用于当前组件元素。通过该属性,可以使得组件之间的样式不互相污染。如果一个项目中的所有style标签全部加上了scoped,相当于实现了样式的模块化。

html片段

更改button样式又不想污染全局就要在元素前加当前外层元素

button样式

复选框改背景颜色,首先去浏览器按下f12审查元素,找到该元素的class名或id名,复制,由于我用了scoped,无法直接更改样式,需要特殊的方式穿透scoped

<stylescoped> 外层 >>> 第三方组件 {

        样式

    }</style>

复选框穿透修改样式

这样就可以了。

相关文章

网友评论

      本文标题:更改element内部样式

      本文链接:https://www.haomeiwen.com/subject/zdkfhhtx.html