如何通过child改变父风格：hover动作在LESS [英] How to change parent style by child :hover action in LESS

问题描述

我有这个LESS设置：

I have this LESS setup:

.wrapper {
    .parent {
       height: 100px;

       .children {
          //some style;

          &:hover {

              .parent & {
                 height: 150px;
              }
          }
       }
    }
}

$ b b

我需要改变父元素的一些高度，方法是将鼠标悬停在它的某个子元素上。这个代码不工作，所以有什么可能做到这一点吗？

I need to change some height for parent element by hover on some child inside of it. This code is not working, so is there any possible to do this? Much thx for help.

推荐答案

将：hover 添加到 .parent 而不是 .children div将实现结果，http://codepen.io/duncanbeattie/pen/xvDdu

Adding the :hover to the .parent instead of the .children div will achieve the result, http://codepen.io/duncanbeattie/pen/xvDdu

.wrapper {
    .parent {
        pointer-events:none;
        height: 100px;
        background:#000;
        .children {
            //some style;
            height:20px;
            background:#f00;
            pointer-events:all;
        }
        &:hover {
            height:150px;
        }
    }
}

这篇关于如何通过child改变父风格：hover动作在LESS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！