::v-deep和&:hover的含义
来避免父组件对子组件的影响,添加了之后只能修改当前组件的样式,但同样引发不能在当前组件修改子组件的样式,因此就出现了深度选择器 ::v-deep。vue项目中经常在style 标签内添加。二. ::v-deep的含义。一.&:hover的含义。
·
一.&:hover的含义
.el-icon-s-fold { font-size: 18px; cursor: pointer; color: #c1c6c8; margin-left: 10px; &:hover { color: #ffffff; } } &指的是上级样式名
以上代码等同于
.el-icon-s-fold {
font-size: 18px;
cursor: pointer;
color: #c1c6c8;
margin-left: 10px;
.el-icon-s-fold:hover {
color: #ffffff;
}
}
二. ::v-deep的含义
vue项目中经常在style 标签内添加 scoped 来避免父组件对子组件的影响,添加了之后只能修改当前组件的样式,但同样引发不能在当前组件修改子组件的样式,因此就出现了深度选择器 ::v-deep
::v-deep .el-dropdown {
color: #fff;
}
更多推荐
已为社区贡献1条内容
所有评论(0)