修改第三方组件样式

原创于 2021-04-22 09:38:10 发布

· 213 阅读

版权

文章标签：

4 篇文章

订阅专栏

本文介绍了如何在Vue项目中修改第三方组件的样式，包括使用全局样式（可能引发样式冲突）、利用Vue的深度选择器（>>>）以及通过Less或Sass的穿透特性进行样式穿透。示例展示了在Less中使用/deep/选择器修改.el-checkbox__inner的边框圆角。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.使用全局样式

但是这种方法会和其他样式冲突

2. 在拥有scope属性的style中使用 “>>>”

>>>是vue的深度选择器

3. 通过less以及sass的方式来实现穿透

<style scoped lang="less">
　.xxx{
　　/deep/ .el-checkbox__inner{  // less语法要通过/deep/ 来找到子级的类
　　　border-radius: 50%;
　　}
　}
</style>