侧边栏壁纸
博主头像
小佑Blog| 小佑前端 | WEB前端博客 | WEB前端笔记 博主等级

未来属于那些相信梦想,并愿意为之付诸行动的人

  • 累计撰写 68 篇文章
  • 累计创建 91 个标签
  • 累计收到 67 条评论

目 录CONTENT

文章目录

/deep/和>>>和::v-deep

@小佑前端
2021-06-16 / 0 评论 / 0 点赞 / 1289 阅读 / 0 字 / 正在检测是否收录...

在style经常用scoped属性实现组件的私有化时,要改变element-ui某个深层元素(eg:.el-input__inner)或其他深层样式时,需要使用/deep/,如

.conBox /deep/ .el-input__inner{
    padding:0 10px;
}

注意,/deep/在vue 3.0会报错
如果/deep/报错,可采用::v-deep,效果基本一样,有人说::v-deep能加快编译速度,但是我在网上没有找到相关资料,无从验证。

.conBox ::v-deep .el-input__inner{
    padding:0 10px;
}

深度作用选择器 >>>
(注意,只作用于css)
但如果是sass/less的话可能无法识别,这时候需要使用 /deep/和::v-deep 选择器。
想修改element-ui某个深层元素也有其他方式解决;
解决方法之一:除非你将 scoped 移除,或者新建一个没有 scoped 的 style(一个.vue文件允许多个style)

0

评论区