样式设置 /deep/

2023-10-30

样式设置scoped属性带来的问题

通常我们在写样式的时候会在style标签中加上scoped属性,相信这个属性的作用大家都很清楚(Scoped CSS规范是Web组件产生不污染其他组件,也不被其他组件污染的CSS规范),但是这样有时候也会遇到问题:
假如我写了一个公用组件,想在父组件中改公共组件的样式,用通常的样式覆盖是不可以的。

解决方案

这时候需要用到 /deep/。

<style lang="less" scoped>
  .goto-result-btn{
    font-size: .2rem;
    width: 4rem;
    height: .6rem;
    line-height: .6rem;
    text-align: center;
    border-radius: .3rem;
    position: fixed;
    bottom: .5rem;
    left: 50%;
    margin-left: -2rem;
    background: #ccc;
  }
  //test和test-text是引用的子组件的类
  .test /deep/ .test-text{
    font-size: 1rem;
  }
</style>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

样式设置 /deep/ 的相关文章

随机推荐

  • git 推送出现 "fatal: The remote end hung up unexpectedly" 解决方案

    在使用git更新或提交项目时候出现 fatal The remote end hung up unexpectedly 原因是推送的文件太大 那就简单了 要么是缓存不够 要么是网络不行 要么墙的原因 特别是资源库在国外的情况下 此问题可能由
  • [508]pandas之read_table、read_csv、read_excel、read_sql

    文章目录 read table 读取csv文件 读取excel 写入excel 将一个EXCEL文件分割成多个文件 将多个EXCEL文件合并成一个文件 read sql 在Pandas中直接加载MongoDB的数据 read table P
  • 耗时一个月,React 知识点万字大总结(超全超基础)

    文章目录 React特点 React 与 Vue 对比 React 与 Angular 对比 JSX语法 state状态 props属性 refs 属性 事件处理 render函数 虚拟DOM 生命周期 脚手架工具 Redux React
  • OpenWrt系统内核设置

    系统内核设置 OpenWrt也是一个 Linux 操作系统 因此它和其他Linux 操作系统一样 可以通过一些配置文件配置 一 etc sysctl conf 配置文件 这个文件是系统启动预加载的内核配置文件 通过sysctl命令读取和设置
  • Fiddler使用技巧(过滤器、解决乱码)

    1 过滤器的使用 1 过滤只展现需要的域名请求 验收抓包效果 2 过去不需要的请求 如下图的正则表达式过滤js css google等等 REGEX js css google ico jpg png favicon mongodb 2 抓
  • platform平台总线

    目录 1 平台总线下管理的2员大将 2 平台总线体系的工作流程 platform本身注册 分析platform设备和驱动的注册过程 platdata probe函数的功能和意义 match函数的调用轨迹 相对于usb pci i2c等物理总
  • 2021-09-01 学习笔记:Python爬虫、数据可视化

    2021 09 01 学习笔记 Python爬虫 数据可视化 结于2021 09 07 内容来自 成都工业大学 数字媒体专业实训 主要内容 PyCharm开发Python脚本的基础配置 Python爬虫基础 正则匹配 re 网页获取 url
  • java 计算百分比

    计算百分比 public static String xx int x int y DecimalFormat df new DecimalFormat 0 可以设置精确几位小数 df setMaximumFractionDigits 0
  • HCIE云计算之FC升级实战操作

    HCIE云计算之FC升级实战操作 一 登录FC6 5 1的VRM管理界面 二 安装升级工具 1 安装完成后自动打开web 2 更改密码登录 三 新建工程 四 选择升级项目 五 VRM参数校验 六 更新包校验 七 VRM升级全流程 1 查看已
  • solr 6.1.0 的配置及简单使用

    2019独角兽企业重金招聘Python工程师标准 gt gt gt 第一部分 配置部分 jdk 1 8 solr 6 1 0 php扩展 2 4 0 jdk路径 usr local solr php路径 usr local php 5 6
  • docker alpine镜像中遇到 not found

    1 问题 docker alpine镜像中遇到 sh xxx not found 例如 monerod 注 此可执行文件已放到 usr local bin sh monerod not found 2 原因 由于alpine镜像使用的是mu
  • Tomcat的简单使用

    目录 1 Tomcat 是什么 2 下载安装 3 启动Tomcat 4 部署静态页面 4 1 部署单个 HTML 4 2 部署 HTML 到单独的目录中 5 tomcat 运行和 直接 html 运行区别 1 Tomcat 是什么 Tomc
  • CppCheck代码静态检测工具

    文章目录 一 简述 二 安装 二 使用 2 1 第一个测试程序 2 2 检查文件夹中所有文件 2 3 检查部分或过滤部分文件 三 严重性 四 其他常用用法 4 1 启用其他检查 4 2 保存结果到文件 4 3 多线程检查 4 3 设置目标平
  • laravel 发布资源失败

    Unable to locate publishable resources Publishing complete php artisan vendor publish 列出所有后选择数字发布
  • Spring Boot Maven项目使用SystemPath引用第三方平台遇到的大坑

    本次与算法厂家对接 使用了他们的Jar包 最先考虑的是不使用Maven仓库 便于离线开发 首先采用了方案
  • 推荐系统介绍

    课程内容 推荐系统在电子商务领域得到普遍的运用 推荐系统本质上是销售系统的一部分 在便利店 推荐系统是导购牌 类目货架 是老板娘 在超市 推荐系统是导购牌 类目货架 是销售员 在电商 推荐系统是什么 不管是在便利店 还是超市 或者电商网站
  • 【数学建模美赛】2023数模美赛备赛指南

    二月中旬要开始美赛了 应该是准备考研这一年的唯一一次正规比赛了 希望能好好完成 在博客边分享边准备 打算开一个新坑 好好准备一下 文章目录 报名事项 赛题特点 六道赛题特点 A B C D E F 竞赛攻略 报名事项 官方网站 美赛官网 h
  • 群晖docker安装chrome

    在docker中下载oldiy chrome novnc 启动这个映像 安装完成后 启动容器 如果路由器wan口是公网ip 可以在路由器上添加5900和8083的端口映射 会更方便访问 如果没有那就可以用群晖的quickconnect 假如
  • 利用Docker 搭建 upload-labs 靶场

    Docker 搭建 upload labs 靶场 靶场搭建 获取upload labs镜像 docker search upload labs 然后下载镜像 命令 docker pull c0ny1 upload labs 如下图即为下载成
  • 样式设置 /deep/

    样式设置scoped属性带来的问题 通常我们在写样式的时候会在style标签中加上scoped属性 相信这个属性的作用大家都很清楚 Scoped CSS规范是Web组件产生不污染其他组件 也不被其他组件污染的CSS规范 但是这样有时候也会遇