当前位置: 首页 > news >正文

scss下解决父组件中使用::v-deep修改样式穿透到子组件的问题

开发中经常会用到深度选择器来修改第三方组件库等子组件的样式,这时候就用到样式穿透(style Penetration)

样式穿透的方式有:>>>、 /deep/、::v-deep这三种
使用中发现了一个问题,就是当在父组件使用了v-deep修改自身组件或者第三方组件样式时,会影响到子组件中的样式,
第一种方式:
使用>>>修改无效,原因是scss等预处理器却无法解析>>>

第二种:
而使用/deep/修改时报SassError: expected selector. 原因是sass不支持这个选择器。

第三种,使用::v-deep,
使用方式:要修改的元素外层套一层box,修改样式时加在选择器前,这样就可以将要修改的的元素限制在当前文件,如下,需要修改class为v-tabs__nav的元素时:

 .tabs-wrap ::v-deep.v-tabs__nav{background-color: transparent !important;}
http://www.lryc.cn/news/211723.html

相关文章:

  • Redis的瓶颈在哪里?
  • 如何在spark中使用scikit-learn和tensorflow等第三方python包
  • JS中call()、apply()、bind()改变this指向的原理
  • BUUCTF 镜子里面的世界 1
  • 【MySQL--->内置函数】
  • FFmpeg 从视频流中抽取图片
  • Oracle RU 19.21及 datapatch -sanity_checks
  • 云原生周刊:ingress2gateway 发布 | 2023.10.30
  • YOLOv8如何关闭AMP混合精度训练?
  • k8s、kubeadm安装
  • kinect v2获取人体骨骼数据
  • JDK、JRE及JVM的关系及作用
  • 组学数据上传(六)|GEO数据库数据上传实操
  • 洛谷,Hydro,Vijos,博客园,GitHub 分别是什么?
  • 自学VUE笔记
  • 系列四十二、Spring的事务传播行为案例演示(二)#REQUIRED
  • oracle rac-归档满处理
  • Python Django 之全局配置 settings 详解
  • 挑选MES系统供应商,需要考虑哪些重要因素?
  • Ai创作系统ChatGPT网站源码+图文搭建教程+支持GPT4.0+支持ai绘画(Midjourney)
  • 基于计算机视觉的坑洼道路检测和识别-MathorCup A(深度学习版本)
  • 【考研数学】概率论与数理统计 —— 第七章 | 参数估计(1,基本概念及点估计法)
  • 获取文本长度
  • python html(文件/url/html字符串)转pdf
  • Spring概述
  • Linux网卡
  • 【Python机器学习】零基础掌握ElasticNet变量选择回归器
  • 【数据结构】模拟实现Vecotr
  • Qt开发: 利用Qt的charts模块绘制曲线、饼图、柱状图、折线图等各种图表
  • Redis:加速你的应用响应时间,提升用户体验