VUE中css样式scope和deep

一、遇到的问题

子组件里明明加了hover样式,但是效果没有出来

二、解决

如下截图,父组件里使用了deep

deep是 Vue.js 提供的特殊选择器,用来突破 scoped 样式的作用域限制,允许父组件的样式影响到子组件中的元素以及再下层级子组件的样式。

默认情况下,scoped 样式只能影响当前组件内部的元素,而 :deep 可以让样式跨越组件边界,作用于子组件的内部元素。

父组件里没有hover样式,覆盖了子组件的hover样式,这样子组件里明明加了hover样式,但是效果没有出来。

相关推荐
又又呢37 分钟前
前端面试题总结——webpack篇
前端·webpack·node.js
dog shit1 小时前
web第十次课后作业--Mybatis的增删改查
android·前端·mybatis
我有一只臭臭1 小时前
el-tabs 切换时数据不更新的问题
前端·vue.js
七灵微2 小时前
【前端】工具链一本通
前端
Nueuis3 小时前
微信小程序前端面经
前端·微信小程序·小程序
_r0bin_5 小时前
前端面试准备-7
开发语言·前端·javascript·fetch·跨域·class
IT瘾君5 小时前
JavaWeb:前端工程化-Vue
前端·javascript·vue.js
zhang98800005 小时前
JavaScript 核心原理深度解析-不停留于表面的VUE等的使用!
开发语言·javascript·vue.js
potender5 小时前
前端框架Vue
前端·vue.js·前端框架
站在风口的猪11086 小时前
《前端面试题:CSS预处理器(Sass、Less等)》
前端·css·html·less·css3·sass·html5