1,父对子
是指父元素触发hover事件,并且控制父元素中的子元素做出响应。
<div class="d1"> <p class="p1">hello</p> </div> .d1:hover .p1{
color:#fff
}
当鼠标移入d1时触发hover事件,其子元素p1的color变为#fff
2,子对父
是指子元素触发hover事件时,其父元素做出相关相应。
<div class="d1"> <p class="p1">hello</p> </div> .p1:hover ~ .d1{
background-color: #fff;
}
使用~号标签来实现对上层元素的控制,当然通过该标签其实是可以控制任意元素的,不仅仅是父元素。
3,同级控制
指处在统一层级的元素的hover控制关系。
<div class="d1"> <p class="p1">hello</p> </div> <div class="d2"> <p class="p1">hello</p> </div> .d1:hover + .d2{
background-color: #fff;
}
.d1:hover + .d2 .p1{
color: #fff;
}
同级元素之间可用+号进行控制。
今天的文章vue 父组件调用子组件方法_vue父组件调用子组件的方法[通俗易懂]分享到此就结束了,感谢您的阅读。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:http://bianchenghao.cn/78798.html