如果你希望 scoped 样式中的一个选择器能够作用得“更深”,例如影响子组件,你可以使用 >>> 操作符:

<style scoped>
.a >>> .b { /* ... */ }
</style>

上述代码将会编译成:

.a[data-v-f3f3eg9] .b { /* ... */ }

有些像 Sass 之类的预处理器无法正确解析 >>>。这种情况下你可以使用 /deep/ 操作符取而代之——这是一个 >>> 的别名,同样可以正常工作。

less使用/deep/

<style lang="less" scoped>
.searchforminline-out {
/deep/ input{
width: 50px;
}
</style>

vue scoped 深度作用选择器的更多相关文章

  1. Vue style 深度作用选择器 >>> 与 /deep/(sass/less)

    传送门:https://vue-loader-v14.vuejs.org/zh-cn/features/scoped-css.html 你很可能会遇到的问题 vue组件编译后,会将 template ...

  2. vue 深度作用选择器

    使用 scoped 后,父组件的样式将不会渗透到子组件中 如果想在使用scoped,不污染全局的情况下,依然可以修改子组件样式,可以使用深度作用选择器 .tree{ width: 100%; floa ...

  3. vue scoped >>> & git conflict <<<<<<< HEAD

    vue scoped >>> & git conflict <<<<<<< HEAD Q: ???还有这操作 A: > > ...

  4. Vue省市区三级联选择器V-Distpicker的使用

    Vue省市区三级联选择器V-Distpicker的使用 最近用的Vue+Element UI时,有些地方需要用到省市区三联选择器,网上安装并尝试了多种类似的插件,但都因为无法正常实现或是没有眼缘而弃用 ...

  5. 【面试题】为什么有时用Vue.use()?及Vue.use()的作用及原理是什么?

    Vue.use()的作用及原理 点击打开视频讲解 在Vue中引入使用第三方库通常我们都会采用import的形式引入进来 但是有的组件在引入之后又做了Vue.use()操作 有的组件引入进来又进行了Vu ...

  6. vue css 深度选择器

    在我们想穿透的选择器前边添加 >>> 或者 /deep/ 或者 ::v-deep. 官方地址:https://vue-loader.vuejs.org/guide/scoped-cs ...

  7. vue scoped 穿透_vue 修改内部组件样式问题

    何为scoped? 在vue文件中的style标签上,有一个特殊的属性:scoped.当一个style标签拥有scoped属性时,它的CSS样式就只能作用于当前的组件,也就是说,该样式只能适用于当前组 ...

  8. Angular和Vue.js 深度对比

    Vue.js 是开源的 JavaScript 框架,能够帮助开发者构建出美观的 Web 界面.当和其它网络工具配合使用时,Vue.js 的优秀功能会得到大大加强.如今,已有许多开发人员开始使用 Vue ...

  9. vue watch 深度监听以及立即监听

    vue watch对象可以监听数据,数据发生变化,处理函数 watch虽可以监听,但只是浅监听,只监听数据第一层或者第二层.比如对于整个对象的监听,需要用到深度监听 vm.$watch('obj',f ...

随机推荐

  1. Android学习Scroller(五)——具体解释Scroller调用过程以及View的重绘

    PS: 该篇博客已经deprecated,不再维护.详情请參见  站在源代码的肩膀上全解Scroller工作机制  http://blog.csdn.net/lfdfhl/article/detail ...

  2. [BTS] BizTalk EDI character set and separator settings

    最近一个项目上遇到需要对EDI头.分隔符.小数点等配置项进行设置. 这里只记录一下结果,原理不记了,多看MSDN. UNB1中的信息在BizTalk中是不会体现在EDI输出文件中的,双方协商好即可. ...

  3. Android Adb命令查看包名信息

    Android O 8.1.0 data/system/packages.listdata/system/packages.xmldata/system/package-usage.listdata/ ...

  4. 最短路问题(Bellman/Dijkstra/Floyd)

    最短路问题(Bellman/Dijkstra/Floyd) 寒假了,继续学习停滞了许久的算法.接着从图论开始看起,之前觉得超级难的最短路问题,经过两天的苦读,终于算是有所收获.把自己的理解记录下来,可 ...

  5. 方差+标准差+四分位数+z-score公式

    一.方差公式 $S^2 = \frac{1}{N}\sum_{i=1}^{N}(X_i - \mu)^2 = \frac{1}{N}[(X_1-\mu)^2 + (X_2-\mu)^2 + ... + ...

  6. elk-logstash-kibana(三)

    一.修改logstash.yml unzip logstash-6.3.2 vim config/logstash.yml #添加:检查所有ip http.host: "0.0.0.0&qu ...

  7. html的空格和换行显示

    一.HTML 代码中的所有连续的空格或空行(换行)都会被显示为一个空格,不管是内容还是标签之间. 二.当我们想让它们在同一行连续显示时,就让所有的代码之间没有空格,也不要换行. 三.当我们想要显示连续 ...

  8. python学习之旅(十六)

    Python基础知识(15):模块 1.可以把模块想象成导入Python以增强其功能的扩展 2.任何程序都可以作为模块导入 3.导入模块并不意味着在导入的时候执行某些操作,它们主要用于定义变量.函数和 ...

  9. xpinyin模块

    import xpinyin s = xpinyin.Pinyin() #一个实例化,以后了解 print(s.get_pinyin('小小军')) #get_pinyin方法,转出来的拼音,每一个汉 ...

  10. 微信小游戏跳一跳简单手动外挂(基于adb 和 python)

    只有两个python文件,代码很简单. shell.py: #coding:utf-8 import subprocess import math import os def execute_comm ...